Android OS Forum banner

Themers' Collaboration

93K views 637 replies 84 participants last post by  mentose457  
#1 · (Edited by Moderator)
Coming from the bionic, I'm liking what I'm seeing as a community goes. While working there, I got involved with a lot of the other themers and we ended up doing a lot of work together whether it be apps or UI work. We did it all and had fun doing it. I'm posting this to:
  1. Try to get somewhat of a collaboration between themers like we had on the Bionic
  2. Try to get more people into this awesome pass time
  3. Show that we are a community and are willing to work together
I want this thread to not only be for advice, but for my fellow themers to have somewhere to come in case they're having issues with a project and would like help from the rest of the community. For those of you interested in theming but don't know what you need to do or have, here's a couple things you'll need to get:

Apk Multi-Tool / Apk Manager (Thanks to raziel23x) - http://apkmultitool.com/?q=node/5
  • This lets you decompile an already built application to modify the images, XML, and smali much more easily.
GIMP (Thanks to the GIMP team) - http://www.gimp.org/
  • This is a great free image manipulation program that (in my opinion) is on par with Photoshop.
Notepad++ (Thanks to Don Ho and all other contributors) - http://notepad-plus-plus.org/
  • This is a great free source code editor and notepad replacement that is widely used among devs and themers.
For those of you just getting into this, refer to post 2-4 for information about how to use these tools to help you with your work. For my fellow themers, feel free to post ideas and projects you'd like help on =)
 
#2 · (Edited by Moderator)
APK Multi-Tool/Apk Manager

I'm not certain if anyone used Apk manager anymore, but what I'll say here is true for both.

Setting It UP

If you're on windows make sure you have Cygwin installed and set up properly or you wont be able to use this tool

After you've downloaded and installed Apk Multi-Tool (or Apk Manager), open the folder containing it and run "script". This will create a few folders if they weren't already there. You'll need to learn to move between these folders to work on your apps and make sure you end up with a polished end product.​

Using This Tool

Now that you have the necessary folders in place, find the application you want to modify and put it in the "place apps here for modding" folder.​

Once you've done that, got back to the script and enter the number to select decompile apk​

Note that some apps (like SystemUI) must be decompiled with dependencies (framework-res/blur-res/ect.)

After the script has finished decompiling the application, move to the "projects" folder and you'll find another folder with the name of your freshly decompiled app. Go into that folder and there you'll find a few more folders. Those folders are where everything is kept for your app to function the way it does.​

When you're finished with your modifications, go back to the script and enter the number to have it recompile the application. After about a minute (depending on the size of the app) it will ask you if the application is a system app. This is a pretty self explanatory question, so I wont baby step you through this. After that, the script will ask you if you want to copy files from the original application to make sure you didn't mess up anything you didn't mean to. Its a good idea to always say yes to this, just to be safe. AND FOR THE LOVE OF ALL THINGS ANDROID, DON'T PRESS ANYTHING YET!!!

If you said yes to this prompt, the script will then copy all of the files from the original app to the "keep" folder. While there, it will look a lot like the folder in the "projects" directory, except there's a file called Classes.dex and a file called Resources.arsc. Go through the folders and delete anything that you have changed (this is getting rid of the old images, xml or smali files) so they don't overwrite your changes and make all the work you just did a waste of time.​

IF YOU MODIFIED ANY SMALI - Make sure to delete the classes.dex file​

IF YOU MODIFIED ANI XML - Make sure to delete the resources.arsc file (you don't need to for all xml, but I do just because I like playing it safe)​

Now that you've got everything in order and you've made sure nothing in the "keep" folder is going to overwrite any changes you want to be made, go back to the script and hit any key to continue. You'll see a bunch of files and percentages fly through the window, and then BOOM! It's done.​

I said it was done, but I didn't say you were unless you like having unusable apps.... Didn't think you did.​
Last, you want to enter the number to tell the script to sign the app (this should take 5 seconds max). When it's done, go to the "place apps here for modding" and find your application. If all went well, you'll see something that says signed(name of your app).apk. Move that app to your sd card (or where ever) and rename it so that "signed" is no longer a part of the name and install it to see your custom app in motion.​

IF AT ANY TIME YOU GET AN ERROR GO TO THE ROOT FOLDER (WHERE ALL THE OTHER FOLDERS AND THE SCRIPT ARE) AND OPEN THE TEXT FILE "LOG" TO FIND YOUR ERRORS
 
#10 ·
Thanks for starting this guide, something a lot of "I'd like to try" themers will certainly find useful.

Last, you want to enter the number to tell the script to sign the app​
This is only true for non-system apps, correct?

Thanks again for getting this thread started, looking forward to seeing the content expanded and refined over time.
 
#3 · (Edited by Moderator)
GIMP

Once you've installed GIMP just open an image file with it and get to editing. There's really too much to go over in GIMP, but I'll give a run down on a few tools that will make image editing a LOT easier.
RGB / GRAYSCALE / INDEXED

There's three different styles .png images can be and those are mentioned above. More often than not, they will initially be 'indexed' when first opening them. To properly edit them, go to:​

Image>Mode>RGB​

This will make many more tools available to edit with and should be something that you do without thinking about before starting your work.​

COLOR REPLACEMENT

Some images are one color and one color only, in this case you can navigate to:​

Colors>Map>Color Exchange​

in this dialog the first option is the value of the color you want to change and the second one is the value of the color you want it to be.​

COLOR ROTATING

This will be the color changing utility you will need to use most. This one will allow you to change a set (by you) spectrum of colors to another spectrum of colors (set by you). To navigate to this one:​

Colors>Map>Rotate Colors​

In this one there are several values you can change and several ways of changing them. The only issue here is that you can't change values to match a specific hex color (unless you know exactly where they fall on a color wheel).​

The top set of values are the ones that will include the color set that you would like to change and the bottom set will be the color set that you want to change to.​

This is a VERY easy tool to use if you just take the time to sit down and mess with it to figure out what all of the options do. There's way too much for me to cover in something that would be considered readable so just open up an image and have some fun with it =)​
 
#4 · (Edited by Moderator)
Notepad++

Installation

Installation is really simple for this. Just download the set up and install it. Easy as that!​
Using Notepad++

This is just like any other notepad replacement program. Enter text and be on your way.​

Features

Notepad++ has a HUGE array of features available in the form of plugins, however I'm just going to talk about some of the basic features built in as soon as you download and install it.​

LINE COUNTER
You may notice that there are numbers along the left side of the window. These are there to easily identify an specific line of code. For example, if there is an error with your app while compiling or decompiling, Apk Multi-Tool will output that error to the "Log.txt" file. To find the issue easier, the log includes the line in which the error is kept. Having that line counter on the left of the screen will not only make it easier to find that specific line but also make it easier to share modifications you have made to specific code so others can enjoy your mods =)​

JAVA CODE AND XML CODE RECOGNITION
Notepad++ comes pre-equipped to handle multiple coding languages, however these are the two that are most important when it comes to theming and its nice that these are already enabled. Here are a couple of examples of what those scripts would look like:​

This is the basic "Hello World" alert in java code:
Image

This is a pretty simple XML code to show some of Notepad++'s features:
Image

Notice the indents in both of the above shots? Notepad++ does those automatically =) So your tab button wont get warn out.​

If there's anything you feel that I've left out of this, please let me know so that I can make sure this thread is as informative as possible =)​
 
#9 · (Edited by Moderator)
I'll second the Gimp recommendation. I've used it for several years and until recently i've discovered the vast library of plugins for it. Which makes it a very powerful program.

Here is a link with THE MOST current stable gimp. Plus some good add on packages. G'mic is awesome.
Thank Partha for putting all of it together and making it available.
http://partha.com/

Also check out the Gimp plugin registry for some single plugins. Outline is very useful.
http://registry.gimp.org/

I use this website for all my colors and values.
http://www.perbang.dk/rgb/33B5E5/

Here is a quick chart that i threw together for alpha layer % opaque (aka transparency). I can post directions on how to figure out easily if needed, but these are the main values that i use.
Code -- % Opaque
31 ----- 20%
59 ----- 35%
7F ----- 50%
A5 ----- 65%
CC ----- 80%

Also, I do not recommend doing this on a 10" netbook, it sucks. A 17" monitor and good mouse are highly recommended.
 
#16 · (Edited by Moderator)
Ok, I just gave this a whirl. Pulled framework-res.apk and systemui.apk from the custom ROM I am currently using. After 'apktool if framework-res.apk', I decompiled the systemui.apk without problems. I went ahead and replaced only 2 png's in the \res\drawable-xhdpi folder (within the project-folder). Started the compiling process, as a system app and used the keep-function. Went into the keep-folder and in there deleted the appropriate png's (representing the ones I had modified in the project folder). Finished compiling without error, so now I have this 'unsignedSystemUI.apk'. I went ahead and opened this apk in 7zip and to see what I have. Looked for my modified png's. There are there - yay - but I noticed that under 'method' it says 'Store' and under 'HostOS' it says 'Unix', whereas for all other files in this folder (which I didn't modify) it says 'Deflate' and 'FAT', respectively.

Not sure what that means and if that has any bearing on being able to actually push that modified SystemUI to the phone. Can someone explain / help?

Thanks in advance.

Edit: If my questions are derailing the thread, I'd gladly take this issue offline via PM or gmail (quinolin@gmail.com).
 
#21 ·
Here are the 3 files for APKTOOL. Unzip them to a folder, toss in your apk. and framework-res.apk and go to town. When you get more comfortable you can setup paths.

Shift and right click inside your folder with the two above files.
Select Open command window here.

apktool if framework-res.apk
apktool d nameofapk.apk

when you are done editing

apktool b nameoffolder do not add .apk just the name of the folder created by the decompile

your output file will be inside that decompile folder under dist.

http://dl.dropbox.com/u/6879136/APKTools.7z
 
#31 ·
Finally got around to doing a bit of a write up for notepad++

Let me know if there's anything else you fell needs addressed in it.

For now, I'm gonna leave GIMP alone... There's way too much for me to cover on it and I'm not feeling the greatest tonight.

Also, don't forget this is also a place for themers to come and get help!