THEME TUTORIAL
Let me make clear that this tutorial is written for Windows. While the procedure may be similar on other operating systems, I use Windows to make my themes as I find the tools available for this task on other operating systems to be cumbersome and unintuitive.
What will you need in order to start making themes for Conquest?
- apktool (I recommend the latest 2.0 beta) and the knowledge of how to use it.
- A file archiving/compression program. I recommend 7-zip but any archiver that supports compressing to zip files should work fine.
- An image editing program. I recommend Paint.NET but any image editor that supports indexed PNG with transparency should work fine.
- Lots of patience
- RECOMMENDED but not required: A file/folder comparison tool, such as WinDiff or WinMerge.
What files/apps can you theme?
The VillainROM Theme System is extremely versatile. It themes apps by replacing files within a compiled apk. This means that you can theme virtually any app/apk on the phone, including user apps. I recommend limiting your theming to:
- /system/framework/framework-res.apk
- /system/framework/twframework-res.apk
- /system/priv-app/Keyguard.apk
- /system/priv-app/SecSettings.apk
- /system/priv-app/SystemUI.apk
As of release 8.4, these are the
only files that get restored when the theme is reverted to default and so are the only files that I support theming.
STEP 1: Create your working folder
The internal structure of the qrt (QuantumThemer Theme File) is as follows:
WORKING FOLDER -- Your working folder. Name it whatever you want.
WORKING FOLDER\Preview.png -- A preview image for your theme.
WORKING FOLDER\system -- Subfolders in here are to be applied to the /system folder on the phone.
WORKING FOLDER\system\Preview.png -- Another copy of the preview image.
WORKING FOLDER\system\framework -- Theming elements for apks in the /system/framework folder on the phone.
WORKING FOLDER\system\priv-app -- Theming elements for apks in the /system/priv-app folder on the phone.
Within each of the subfolders inside of the system folder (framework, priv-app), you'll need to create another folder for each of the APKs that you want to theme. For example, if you are only theming framework-res.apk, you'll need to create a folder named "framework-res.apk" within the system/framework folder. If you are theming both framework-res.apk and SystemUI.apk, you'll need to create the above folder as well as a folder named "SystemUI.apk" within the system/priv-app folder.
All folder names are case sensitive and the only two folders that should ever be in the system/framework folder would be "framework-res.apk" and/or "twframework-res.apk" as these are the only two supported files that exist in that folder on the phone.
STEP 2: Decompile your desired APK
The next step is to decompile the file that you want to theme. This is important as certain files that can be themed don't exist in a compiled APK so using apktool, decompile your desired APK. For this example, we'll use SystemUI.apk. I recommend making two copies of the decompiled APK folder for comparison later.
STEP 3: Start theming
Now it's time to get creative. You can recolor, edit, or replace virtually anything in the apk. Inside of the decompiled APK folder, you'll find a res folder. Inside of the res folder, you'll find various other folders. I recommend sticking primarily with the "color," various "drawable," and various "layout" folders.
For extra theming you can also jump into one of the "values" folders and edit "colors.xml," "dimens.xml," and "styles.xml." If you've ever looked into a compiled APK file, you'll notice that not only do these files not exist, but there are no "values" folders. I'll talk about that later.
Something to remember when it comes to PNG files is that there are two kinds of PNG files in an APK: standard and patch9. Patch9 PNGs are designed to be smoothly scalable to different sizes, thus eliminating resizing artifacts present when a standard PNG is stretched across a larger area. The caveat is if you're replacing a patch9 file, try to make sure you replace it with another patch9 file with similar properties or the scaling might be off. Some scales are built into the smali code and some just scale to wrap the content. If you're editing/recoloring a patch9 file, stay away from the borders. The 1-pixel wide/tall border on all 4 sides of the PNG must remain solid black (HTML color code #000000) or solid red (HTML color code #FF0000).
Text colors are typically controlled either by an XML file in the "colors" folder, by a value in a "colors.xml" file located in one of the values folders, by a value/style in a "styles.xml" file in one of the values folders, or by an XML in one of the layout folders. Recoloring text and various other UI elements can require a lot of trial and error, this is where the patience comes in.
STEP 4: Create a list of modded files and recompile
Next you'll need a list of the files that you've modified. You can either do this by creating a running list of the files and what subfolder they're located in as you go or use a folder comparison program to diff out the modded files. A good comparison program should give you the option to export a list of files that are different.
Once you have your list of changed files, use apktool to compile your modded APK folder. Many guides to apktool will also tell you to re-sign the resulting APK. That's not necessary here.
STEP 5: Extract the modded files from the new APK
At this point, you'll refer to your list of changed files and use an archiver to extract them from the APK. The folder structure must match that of the decompiled APK exactly. If your list of modded files includes anything from one of the various "values" folders, you'll need to extract the
resources.arsc file from the root of the APK file.
For the tutorial, let's assume that we changed the layout of the carrier label (layout\carrier_label.xml), replaced the alarm notification icon (drawable-sw360dp-xhdpi\stat_sys_alarm.png), recolored the notification drawer pressed handle PNG (drawable-xhdpi\status_bar_close_on.9.png), and changed the status bar clock text color (values\colors.xml).
In this example, your folder structure would be:
WORKING FOLDER\system\priv-app\SystemUI.apk\res
WORKING FOLDER\system\priv-app\SystemUI.apk\res\drawable-sw360dp-xhdpi
WORKING FOLDER\system\priv-app\SystemUI.apk\res\drawable-sw360dp-xhdpi\stat_sys_alarm.png
WORKING FOLDER\system\priv-app\SystemUI.apk\res\drawable-xhdpi
WORKING FOLDER\system\priv-app\SystemUI.apk\res\drawable-xhdpi\status_bar_close_on.9.png
WORKING FOLDER\system\priv-app\SystemUI.apk\res\layout
WORKING FOLDER\system\priv-app\SystemUI.apk\res\layout\carrier_label.xml
WORKING FOLDER\system\priv-app\SystemUI.apk\resources.arsc
STEP 6: Create, test, and share theme
When you're done creating your mods for all of the apps/apks that you want modded, it's time to create a test theme. You'll need to create a dummy Preview.png file (or use one from an existing theme) and place it in the "WORKING FOLDER" and "WORKING FOLDER\system" folders. After you've done that, compress everything in the "WORKING FOLDER" into a zip file and rename the .zip extension to a .qrt extension. Push your test theme to your phone and try it out. If anything isn't right, repeat the above steps to correct it and test again until you get it just the way you want it. When you have everything the way you want it, take a screenshot to replace the Preview.png file in your theme and re-compress it to a zip file (remembering to change the extension to .qrt) and share it as you see fit.
FURTHER REFERENCES
- QuantumThemer -- The original thread for QuantumThemer (my version is heavily modified, but the principle remains the same). Check here for a sample theme/preview and other information if you want to know how the theme system works.
- VillainTheme -- The VillainROM Theme System thread. More sample themes and additional information on how the theming system works.
- @radley's Patch9 guide -- a very well-written guide on how patch9 PNGs work.
