Database Develop

Bulk image editing (ie for drawable folder)

A quick tip to change the colors of hundreds of images in seconds, for example to make new versions of your android theme.
We are using a loop and a shell command that is technically an image editing software:
for i in $( ls ); do convert $i -modulate 100,100,160 $i; done
Results:
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
You should check the documentation for further info (this thing, ImageMagick, does absolutely everything). But if you only want to change the color you have to know those three values in the example are brightness,saturation,hue. More.
I use linux but in it's website you can download binaries for Windows and MacOS too.
(Posted in my blog some time ago, link)

Awesome man, just used this to work on a personal theme. Works like a charm.

Technically this is good for easy color changes, you'll still have to manually fix the .9.png files to work.
I prefer to use the 'file>automate>batch' and custom actions in photoshop to do the same thing. Works like a charm, and if you know how to record custom actions you can get more than just color changes out of it.

prash said:
Technically this is good for easy color changes, you'll still have to manually fix the .9.png files to work.
I prefer to use the 'file>automate>batch' and custom actions in photoshop to do the same thing. Works like a charm, and if you know how to record custom actions you can get more than just color changes out of it.
Click to expand...
Click to collapse
what's the method of doing this in photoshop? i have the CS4 edition and gimp. thanks

opasha said:
what's the method of doing this in photoshop? i have the CS4 edition and gimp. thanks
Click to expand...
Click to collapse
What I normally do is open a single image from frameworks, open up the actions tab, hit record and record everything I do to that single image. Then save the action. Then personally I like to open all the images I want that same action run on and goto file>automate>batch and let it run the action i create on all open files. You can let the automate process save the files by itself too but I like to create a second action that just saves on its own. So I can review the changes before running the save action.

prash said:
What I normally do is open a single image from frameworks, open up the actions tab, hit record and record everything I do to that single image. Then save the action. Then personally I like to open all the images I want that same action run on and goto file>automate>batch and let it run the action i create on all open files. You can let the automate process save the files by itself too but I like to create a second action that just saves on its own. So I can review the changes before running the save action.
Click to expand...
Click to collapse
thanks a lot prash

prash said:
Technically this is good for easy color changes, you'll still have to manually fix the .9.png files to work.
I prefer to use the 'file>automate>batch' and custom actions in photoshop to do the same thing. Works like a charm, and if you know how to record custom actions you can get more than just color changes out of it.
Click to expand...
Click to collapse
I love that action. Helped me to do the color change on your alien aqua icons and made it easy to make the remainder icon for the rest of the apps. Thanks for letting me borrow some of it. I love the white with the blue outer glow, it looks great in the purple and pink too

As far as I've tried it works fine with .9s too.
But yes, I'll have a look at that photoshop thingy next time I fire up windows

Nauxer said:
As far as I've tried it works fine with .9s too.
But yes, I'll have a look at that photoshop thingy next time I fire up windows
Click to expand...
Click to collapse
What I meant is that if you ONLY do the color shift/hue change on the .9 images, it will LOOK different sure, but it will look all stretched out and weird once you put them back on the phone. You WILL have to redo the .9.png borders and compiling on the new edited images once you do the color changes stated in this method.
(That is, unless you're working with source images, then its probably the best way to bulk edit all the images before compiling them into a theme)

[HELP] error when opening png files in photoshop

im having some trouble opening some png images in photoshop. for instance
i want to open this file
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
and it opens looking like this
using cs4 on windows 7

uh...thats how png files open. the checkerboard background means its transparent.

was that a joke?

xxmonsterx said:
was that a joke?
Click to expand...
Click to collapse
He's right though, the checkers are there since that is a transparent image excluding the blue dot of course. It looks like that on mines too.

no no nooo, i mean the distortion in the color and gradient

xxmonsterx said:
no no nooo, i mean the distortion in the color and gradient
Click to expand...
Click to collapse
Are you zoomed in?

no lol when i open the first file in pscs4 it opens looking like that, wheras if i open the same image in say, paint. it looks normal, but paint isnt very good for image manipulation

then i cant help you, its gotta be something unique to your settings/computer. i use cs4 for everything, even tried opening the png you posted and it looks perfectly normal to me.

wierd, hm im gonna try to reinstall in x86 mode

If you zoom out to original size, perhaps it will look as you expect?

Is the color mode in Index or RGB?

Kazan22 is right - you need to switch color mode from "indexed" to "RGB" ant it will look as it should. It's been a while since i last used photoshop, but if i remember correctly there's a selection in the image->mode menu (or something like that).
GIMP also has similar problem - you have very limited editing capabilities if you don't change the colorspace to RGB. But at least it displays images correctly

changing color to rgb mode it still looks the same, but your right it was opened as index by default. i figured out a rather complicated method to get to do what i want using photoshop and ms paint together lol

Download paint.net, open said file. save. open newly saved file in photoshop.

I know what you mean, I have the same problem with some pngs from framework too. I still don't know what can it be

prash said:
Download paint.net, open said file. save. open newly saved file in photoshop.
Click to expand...
Click to collapse
This.
Photoshop has horrible png support.. it can't deal with alpha or indexed images properly. If your images have been run through optipng, photoshop will mess them up like this.

goldenarmZ said:
This.
Photoshop has horrible png support.. it can't deal with alpha or indexed images properly. If your images have been run through optipng, photoshop will mess them up like this.
Click to expand...
Click to collapse
Well, you can always use the GIMP, It's free and handles these png's properly (if set to rgb colorspace)
Inkscape (free/opencource as well) also imports these png's properly. It's a vector drawing program, not raster like photoshop or gimp so it takes a bit of time to get used to, but in the end it pays off since image created once can be saved at any resolution - makes porting themes to different resolutions a breeze That's what i used to create some icons for windows mobile, and i was really glad i did when i switched from a qvga to wvga device

mr_deimos said:
Well, you can always use the GIMP, It's free and handles these png's properly (if set to rgb colorspace)
Inkscape (free/opencource as well) also imports these png's properly. It's a vector drawing program, not raster like photoshop or gimp so it takes a bit of time to get used to, but in the end it pays off since image created once can be saved at any resolution - makes porting themes to different resolutions a breeze That's what i used to create some icons for windows mobile, and i was really glad i did when i switched from a qvga to wvga device
Click to expand...
Click to collapse
The GIMP actually has the same PNG problems as photoshop.. images run through optipng won't render or save properly.
Personally I'm using Illustrator mainly now since I'm making themes in ldpi and hdpi.. I only use photoshop to chop things up.

goldenarmZ said:
The GIMP actually has the same PNG problems as photoshop.. images run through optipng won't render or save properly.
Click to expand...
Click to collapse
Well, that's not entirely true:
The same image as in original post (pulled from ADW launcher apk), the left one is in indexed color mode (colors are fine, but there's only 1 bit alpha), the right one is exactly the same image but after changing colorspace to RGB. After modifying the file, saving it (as RGB) and applying a metamorph with it, android displays it correctly. The resulting RGB file might be a bit larger in size than indexed one, but i never really compared them.
Not trying to prove anything here, just correcting a slight misinformation - everyone uses the tools he/she is best at

mr_deimos said:
Well, that's not entirely true:
Not trying to prove anything here, just correcting a slight misinformation - everyone uses the tools he/she is best at
Click to expand...
Click to collapse
Weird.. I was absolutely convinced I'd tried that in gimp. Thanks for the info.

[Q] How to theme for T-Mobile theme chooser?

I recently have been trying to create a theme for the T-Mobile Theme Chooser that comes with CM7. I pulled the cyanbread apk and extracted it and just began to replace the images with my own, until I came across some indexed images. Basically when I open these in photoshop it turns all the alpha transparencies to opaque.
Original Image:
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
After import then saved:
Obviously I can't work with this.
Is there a template or something that I can work with? Or an easier way? I'm basically just taking the best parts of a couple themes and putting them together, and editing the colors. I'm not smart enough with xml to write code from scratch.
Thanks.

I use gimp. It has a setting to change the mode from "indexed" to "RBG" or "greyscale".

When I run into those, I open them in pixlr.com (a free image editor that pretty much ignores permissions), save them, then re-open in Photoshop.

iamthebigcheeze said:
When I run into those, I open them in pixlr.com (a free image editor that pretty much ignores permissions), save them, then re-open in Photoshop.
Click to expand...
Click to collapse
Thanks man, helped a ton.
Unfortunantly I keep running into speedbumps, anyone mind helping me here?
I have two themes at the moment, mine and another one. The other one replaces the widget icons in the notification bar. I like those much better than the stock cm7 ones. The problem is is that I can't just drag them and drop them from drawable folder from theirs to mine, as I'm assuming the XML in mine doesn't have any code to tell that image where to go.
How would I go about editing the xml file(s) to add support for theming of these icons? I have never really touched xml before, plus I haven't had any success finding how to edit any of the xml's in the apk.

Leave xml alone just drag and drop
Sent from my GT540 using XDA App

pashinator said:
Leave xml alone just drag and drop
Sent from my GT540 using XDA App
Click to expand...
Click to collapse
Problem is is that the apk I'm using as a template does a ton of stuff I don't want it to, but some stuff I do.
Like it reskins the whole browser and shrinks the pop-up menu when you hold your finger on the home screen. I don't want this, and just deleting the images doesn't solve the problem because I get errors while compiling.
The only thing I really want is the ability to skin notification bar widget icons (toggle wifi, gps, etc). Haven't had much luck finding themes that do.

You still need to resign a theme.apk after replace new png files!

What key do you sign it with?

I've got a couple themes up and running right.now and would be happy to help. Do you use Linux, Mac, or windows? Do you have decompiled Apk's that you're working with or are you editing compiled ones?

With theme *.apk file, I can only replace the existing icons, then use apk manager to sign, i cannot add new icons into it!

You can check out my theme chooser guide here

nhnt11 said:
You can check out my theme chooser guide here
Click to expand...
Click to collapse
+1. I used this guide as well. It's a great help

[req] help with GoSMS Theme Maker

Okay, I've been working on a Viber style theme on behalf of my girlfriend using gosmstheme.goforandroid.com but it just doesnt want to work properly, often showing boxes around my speech bubbles or whatever.
Anyway I was wondering if anyone could quickly do it? It's driving me crazy, its basically the iphone theme built into gosms with a purple bar instead of a blue bar and a pure white background.
If no one is willing to do it, could someone tell me where on my phone the gosms themes are stored so i can edit it myself cos the online theme maker currently has lots of bugs.
Heres actual Viber:
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
The online theme maker misses exactly 1 row of pixels off the top of the purple top bar and shows a dark border around my bubble images making it incredibly ugly.
Can anyone help? I can upload the resources I made if anyone is interested in helping.

Heres how it looks so far. crap, in other words.
see? the png files become distorted as the are stretched and the boxes dont match up well. heres the resources if anyone else wants to try.
Body:
Recieved:
Sent:
Top Bar:
Anyone care to help?

I'm not sure if it can use 9patch files, which allows images to be resized without distortion. Google it up for more info and how to create them.
Also, remove the white backgrounds in the speech bubbles, and perhaps add some space around them

Thanks for the reply, I tried removing the white background but it didnt work (it showed up as light grey for some reason). I'll look into the 9patch files. Cheers.

Super short answer:
Edit: Those images were suppossed to have black lines on the borders, not sure what happened there xP
Use thoses as guides. Open them directly with Photoshop or other tool. Do not copy/paste. That could mess with the transparent background.
Short answer:
Those bubbles are way to near to the borders, you need to leave some space in there. As ock said, you should probabbly use draw9 too. In short it's a special kind of png images (9.png) that have a tiny transparent 1 pixel border which can be filled with black if you want to stretch them verticaly or horizontaly.
Long answer:
You could try the GOSMS Theme maker here http://gosms.goforandroid.com/?p=235, you need Java for that.
Just run ThemeTool.bat, configure what you want and then apply. This is going to generate a file called _signed.apk if I remember correctly.
Then you can use apk_manager to decompile it, all you need to do is place the apk (which you can rename) into the "place-apk-here-for-modding" subfolder and then run Script.bat.
That's going to show you a menu, the option you need to pick is 22 for choosing your project. And then 9 to decompile. When you pick 9, its going to make a subfolder in "projects" named "_signed.apk" or whatever you called it. You can access that folder and edit every single image in there.
The images you're looking for are inside "\res\drawable-hdpi", the names are
msgbox_other.9.png
msgbox_other_selected.9.png
msgbox_self.9.png
msgbox_self_selected.9.png
Those kind of files are very sensitive, the borders need to be transparent or black, if they're not, the project wont compile until you fix it. So, make backups a edit carefully.

Thanks dude.

Assistance needed - Editing framework-res.apk

I need some help in figuring out what images to edit in my framework-res.apk . I do not like the background for the notifications found in a theme i downloaded from the market for CM7 . I used UOT to make a framework-res.apk file (Custom Theme) and i want to use that image for the background . So i am using a self updated version of apk Manager to extract and sign my apks . but i can not for the life of me figure out which file controls the background for notifications . Can anyone shed a little light on the subject for me ? Ive googled and i found one thread stating that all png's for the status bar must be edited . but i find that not helpful as i dont know which pngs are in controll of the status bar and notifications background . I appreciate all help given ! Btw i appologize if im in the wrong section .

can you post a pic of what exactly you want to change? i have answers...but just want to be on the same page as you.

As you can see , my notifications window is brought down by dragging the status bar down . I hate that ugly background in the notifications window . I want to change it . But can't figure out how . Btw I failed to mention this is a theme I downloaded .
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Sent from my HTC HD2 using Tapatalk

those are in the system ui apk, not framekworks.
like the pic with is shade_bg.
however, to change those remember you need to change the theme's apk, not your system as themechooser in cm7 supercedes the system.
cheers.

jsmccabe78 said:
those are in the system ui apk, not framekworks.
like the pic with is shade_bg.
however, to change those remember you need to change the theme's apk, not your system as themechooser in cm7 supercedes the system.
cheers.
Click to expand...
Click to collapse
AHA ! You are amazing . I cant believe its named shade_bg like i was looking for something along the lines of notifications_background or notifs_bg or something that makes more sense xP that worked btw . now i have another question for you Since youre amazingly smartical !!
Here is a picture of the default theme . Notice where my toggle buttons are (at the top) its a solid background . But where my actual notifications are its not solid . Is this controlled by an xml ? i took apart the default SystemUI.apk and looked at the shade_bg and it is the same throughout(i figured the top of the image was solid and the rest was transparent)

it would make things easier if you drew on the picture so i knew exactly what you are looking at.
if you are talking about the area around the words "no service" and "ongoing" the background is a .9.png but i forget which - however, i have never seen it transparent.
the green bars can be removed with xml editing.
the white bg of the "auto-rotate switch" is a .9.pngs.
all the lettering is in xml/ colors.
the best idea (when i was making these) is to make things outlandish colors, compile and see what it looks like.
also see:
http://forum.xda-developers.com/showthread.php?t=964391

jsmccabe78 said:
it would make things easier if you drew on the picture so i knew exactly what you are looking at.
if you are talking about the area around the words "no service" and "ongoing" the background is a .9.png but i forget which - however, i have never seen it transparent.
the green bars can be removed with xml editing.
the white bg of the "auto-rotate switch" is a .9.pngs.
all the lettering is in xml/ colors.
the best idea (when i was making these) is to make things outlandish colors, compile and see what it looks like.
also see:
http://forum.xda-developers.com/showthread.php?t=964391
Click to expand...
Click to collapse
Hey thanks for the reply ! I actually looked at the xml and it used a different png . The name was like statusbar_background.png or something like that
. And my theory was correct . Just the top of the image is solid making the background of the toggle buttons solid . And thanks for that think gives me something more to tinker with :-D
Speaking of tinkering , I was messing around with uot and I wanna get the animated background for the notifications . I tried uploading my themes apk but when I tried switching to the uot theme themeChooser said the theme was incorrectly compiled therefore I could not use it . Do you know how I can edit the xml of my theme to give it the animated background ? I uploaded my systemUI and then took it apart to see how it does the animations . And its a series of .png images . But I don't know what modifications are needed to my themes xml to get the animations working . Thanks again for all your help ! You are truly a theme master :-D
Sent from my HTC HD2 using Tapatalk

I don't have an exact answer. What files are you seeing as part of the animation? Also, often they are controlled by an XML in the drawable folder (not the hdpi one.) I have changed some animations but not am expert. I would search the thread I gave you to see if possible.
Sent from my HTC HD2 using XDA