• XDA Forums have been migrated to XenForo. We are aware of several issues including missing threads, logins not working, and more. To discuss, use this thread.
  • If you are experiencing issues logging in, we moved to a new and more secure software and older account passwords were not able to be migrated. We recommend trying to reset your password, then contacting us if there are issues.

[HOW TO] Do it yourself guide for theme editing

xtremekilla09

Retired Recognized Developer
Jan 28, 2009
1,464
523
0
To get started, read the posts below by tsachi.
Then give this a glance - Do it yourself guide for theme editing

More Resources:


Info on how to edit the items in notification bar:
+ http://forum.xda-developers.com/showpost.php?p=11158662&postcount=3

All credit belongs to the original authors. I am simply gathering all this information to make it easier.
For any help or support, post in this thread and we will try to help you the best we can.
 
Last edited:

tsachi

New member
Sep 23, 2010
1,345
293
0
Expanded Information

Introduction
The link in OP gives you instructions on how to replace images, but it lacks information for the inexperienced themer. Here is some background information and some more details on the steps before and after you insert new images in your framework.

System Icons and background images sit in two main files: framework-res.apk and twframework-res.apk. Within these files there is a res directory, and under that you have the folders containing data. Google has guidelines on icon design, although themers usually ignore those in order to get a different from stock look. One thing you would notice is that there are a lot of repeated icons. For example, framework-res.apk has both drawable-hdpi and drawable-hdpi-v4. The first is there for compatibility with older APIs (anroid 1.6 or older) so I am not sure why it is still there, but if you remove it your phone will not like it.

Each application has its own res folder where the launcher icon and other visuals are kept. There are, however, a lot of applications that reference the framework.apk for visuals. An example is the dialer that calls on some background images from both framework-res and twframework-res.

There are 2 types of images that you would encounter. Normal icons and images are non-scalable. They take a certain amount of real estate on the phone, and that’s it. Example of these are the battery levels and notification icons. The other type is the .9 images. These are images that are going to be stretched to fit whatever space is needed. An example of that are the menu backgrounds. The .9 images have a special format. The one pixel border around them defines how they stretch and how content is displayed in them. It is highly recommended to follow the standards in order to get repeatable and consistent look. Android SDK has a tool to help with .9 file design: draw9patch.bat.
Important note: The .9 files show the borders ONLY when de-compiled. If you grab a file from the framework directly you will not see that line. It is therefore required to compile the .9 files after you make them. You can use apk manager or ThemePro-JAVA to recompile the framework apk after modifying the files.

Definitions for which image is used where sit in the xml files under the drawable folder. These are compiled xml files, you can’t edit them with a text editor. For this introduction I will not go into modifying xml files. Each apk also has a resources file that describes what is in there. If you add, remove, or rename files in the apk you will have discrepancy with the resource file and the theme will not work (more likely you will be stuck in an infinite bootup loop)

Before you start:
Warning: frameworks are highly linked with other files. You can’t just take a framework from one ROM and put it in another. Always keep a backup of the original files ready to be installed (see below), otherwise you may need to re-flash the ROM. Frameworks are also sensitive to compression. DO NOT use winzip to handle the files, it can cause problems with the final apk file.

There are several things you would need before you start
  1. A rooted phone
  2. SDK installed on the computer
  3. A zip handling software other than winzip (winRAR and 7-zip are both good options)
  4. Auto-sign (http://forum.xda-developers.com/showthread.php?t=471634) or signing tool (http://forum.xda-developers.com/showthread.php?t=473580)

Create a backup
Grab the framewor
  1. k-res.apk and twframework-res.apk from your phone. They are located in the system/framework folder. You would need them as a starting point for your modification and you need them for a backup
  2. Create a clockwork installation file of the original files (see post below)
  3. Name the installation framework-original.zip, or something else that would be easily recognized in
case of trouble, and then copy it to your internal sd card.

After you are done modifying files
  1. Create an installation file (see post below)
  2. Give the file a name that is easy to recognize and copy it to your internal sd card
  3. Reboot into recovery
  4. Select install zip from card -> choose zip from sdcard
  5. Select the installation of the new framework and confirm the installation
  6. Reboot
  7. If you are stuck in an infinite boot-up cycle
    1. Take the battery out
    2. Using 3-key combination boot into recovery (up-down volume + power. Hold until the AT&T screen cycles back, then release)
    3. Install your original framework backup and reboot
 
Last edited:

tsachi

New member
Sep 23, 2010
1,345
293
0
Creating clockwork installation

After you have finished modifying the files, the best way to get them to the phone is through clockwork installation. Make sure that you have the original update.zip file on the sdcard. If you have a rooted phone, you probably have that already, but if not you can install ROM manager from the market and run it to get the update in place.

To create the installation file follow these steps:
  1. Create a folder \framework
  2. Place your modified framework files in that folder
  3. Back in the main folder, create the following folder tree: \META-INF\com\google\android
  4. In the android folder create a text file named update-script
WARNING: Do not name your framework file "update.zip"! You need both the original update.zip and the framework one for the installation.
Note: Although copying of the framework files may be possible, it is highly risky. In my experience installation from clockwork is the easiest
 

tsachi

New member
Sep 23, 2010
1,345
293
0
Puzzle Lock Screen Mod

Here is information for people who want to modify the look of the puzzle lock screen. It is only the list of images to replace, not the coding to change functionality.
The files sit in framework-res.apk under res\drawable-hdpi. The files are zzz_unlock_puzzle...

puzzle pieces
zzz_unlock_puzzle_noti_icon_call.png : Missed call piece in the floating state
zzz_unlock_puzzle_noti_icon_call_fit.png : Missed call when it gets to the unlock spot
zzz_unlock_puzzle_noti_icon_unlock.png : General unlock floating
zzz_unlock_puzzle_noti_icon_unlock_fit.png : General unlock at the unlock spot
Same for messages and voicemail.

Background
zzz_unlock_puzzle_bg.png : The image that shows on the lock screen. This should be semi-transparent if you want to show the regular screen background
zzz_unlock_puzzle_bg_pressed.png : Image that shows while dragging the puzzle pieces. Usually a slight modification of the regular background
zzz_unlock_puzzle_bg_land.png : The landscape version

Music player
zzz_unlock_disk... and zzz_unlock_ctr_pr... are the files related to the player.
zzz_unlock_ctr_bg.9.png is the background for the music controls

Text background
Overlaying the unlock image is text. That text can have background that is more opaque than the rest of the unlock screen.
The attached image shows the three regions. These regions also apply to the glass unlock.
Note: These are .9 files and should be done right to ensure correct stretching and text boundries.

Other files
There are some extra background files in the frameworks but I haven't been able to find where they go. There are also some files to control the clock numbers zzz_unlock_clock_...
 

Attachments

Last edited:

tsachi

New member
Sep 23, 2010
1,345
293
0
Working with APK manager

What is APK manager?
APK manager is a tool for decompiling / recompiling apk files. If you want to change anything other than images, it is a must have.

The basics
The basic flow when using APK manager is
  1. Place apk file in place-apk-here-for-modding folder
  2. run the Script.bat file
  3. Type 22 and select the file you want to work with
  4. Type 9 and wait for it to finish decompiling
  5. Modify the items you want modified (they will be in the projects folder)
  6. type 11 to recompile

Sounds easy? It is, and it isn't. There are several places where things can go wrong. Here are a few of the things to watch for:

Bad starting file
This is mostly true for framework files that went through several cycles of modifications. The framework is forgiving to having extra items, or having bad .9 images (see post above about .9 images). Some people may have replaced images without recompiling the framework in a way that breaks internal links. If this happens you will very likely see error messages during the decompile stage. If that happens check the log file and correct things. One of the most common errors is .9 files replaced with regular images. See this post for how to solve this.
Things may not always be "fixable", so the best approach is to get the original framework that is the base for the one you need. Having a clean start can save a lot of headaches later on.

Overwriting your changes
When you recompile, assuming everything worked ok, you are prompted if this is a system file. Most likely you want to say yes. This ensures that the original signature is copied over. You will also be prompted if you want to copy some files over from the original. BE CAREFUL!. There are people who say you reduce the risk of errors if you copy things that didn't change. Personally, if I changed anything that required recompilation (mostly added new images or modified xml files) I always choose not to copy extra files. If you do choose to copy some files over, pay attention to the next step. Do not hit any key until you remove the modified files. You will need to go to the newly created "keep" folder (in the top apk manager directory) and remove any image that you changed and any xml that you modified. Also, if you modified xml files to add new images you need to delete "resources.arsc".

Failed rebuild
APK manager is trying to minimize work by only compiling newly changed items. If you built an apk and realized you have an error, or want to add more changes, I recommend removing the cached build. Go to the projects folder and delete the "build" folder. I've had cases where the new items didn't catch.

Removed items
I highly recommend to leave icons that you do not need. I've had occasions where I removed things that I thought had no more reference, but then ended with endless boot-loops. For example, if you modify the xml to only show 6 out of the 101 battery charge animations, leave the remaining icons in your project.

If you're stuck
Look at the log file. That would usually give you an answer. Also, if you are working on a recent GB ROM you probably need to get the beta 5 version. Version 4.9 will have problems compiling the newer files.
 
Last edited:
Dec 12, 2010
175
42
28
Philadelphia
After you have finished modifying the files, the best way to get them to the phone is through clockwork installation. Make sure that you have the original update.zip file on the sdcard. If you have a rooted phone, you probably have that already, but if not you can install ROM manager from the market and run it to get the update in place.



To create the installation file follow these steps:
  1. Create a folder \framework
  2. Place your modified framework files in that folder
  3. Back in the main folder, create the following folder tree: \META-INF\com\google\android
  4. In the android folder create a text file named update-script
WARNING: Do not name your framework file "update.zip"! You need both the original update.zip and the framework one for the installation.
Note: Although copying of the framework files may be possible, it is highly risky. In my experience installation from clockwork is the easiest
Thanks for this.. Question In #4 above the text file in the android folder. Is that an empty file? no extension? Thanks for your help.
 

tsachi

New member
Sep 23, 2010
1,345
293
0
Thanks for this.. Question In #4 above the text file in the android folder. Is that an empty file? no extension? Thanks for your help.
The file has no extension but it isn't empty. It contains the installation instructions. Typical instructions would be:
copy_dir PACKAGE:framework SYSTEM:framework

which copies everything in the frameworks folder in the zip file to the system/framework folder on the phone

Sent from a captivate running phoenix using XDA app
 

Tritan88

New member
May 1, 2009
244
40
0
Waterloo
This needs to be a sticky. I detailed guide is just what was needed. I been wanting to play around with themes but always end up doing something stupid so it never works. Now I have some more knowledge and hopefully can avoid that mistake.
 

tsachi

New member
Sep 23, 2010
1,345
293
0
Since the thread is getting more life, I just added info on lock screen (fourth post)

Sent from my captivate running the latest firefly
 

Dave the Knave

New member
Apr 18, 2008
1,653
353
0
Baltimore
I'm quite happy that this has been pinned finally. Now to get to work. I haven't decided on which ROM I want to do, or even if I wanna port another theme or make my own. SO MANY CHOICES!!
 
Our Apps
Get our official app! (coming soon)
The best way to access XDA on your phone
Nav Gestures
Add swipe gestures to any Android
One Handed Mode
Eases uses one hand with your phone