This tutorial is for « every » operating system. In this tutorial I will change the color of some object of the XDA Labs app . There will be 2 part for this guide, the first is the general method and the second one is the description of what I’ve done on the XDA Labs app to theme it. Please , before asking , read the entire OP , maybe your answer is into it.
I’m running Ubuntu 16.04 LTS but the softwares are also compatible with windows and mac.
Which software I use :
I-General Method :
1-First you need to set-up your PC’s environment:
2-What you should know before theming:
1-A regular line in this file is built like this :
-<color name="[object’s id]">#[alpha channel][hex code]</color>
- Alpha channel : This is the 2 characters that change the opacity of the color
- Hex Code : This is the 6 characters that define the color itself
3-For example :
<color name="design_fab_stroke_end_outer_color">#0f000000 </color>
- «design_fab_stroke_end_outer_color» is the id of the object I want to change the color from
- «0f» is the alpha channel of the initial color
- «000000» is the hex code of the initial color
4-To modify them :
Replace the hex code of the initial colors by the hex code of the color you want to add , be careful not to delete a piece of the line with the old hex code because it will cause errors on apktool. I use alpha colour app for Android to see levels of opacity and to find color’s hex code.
• Search for the picture you want to change in the drawable folder or mipmap folder
• Folders you want to browse to find the pictures :drawable-xhdpi-v4 / xxhdpi-v4 / xxxhdpi-v4 for the « in-app » pictures , every mipmap folders for icons (sometimes icons are in drawable folders and there aren’t any mipmap folders).
• When you prepare the pictures , make sure they have the SAME SIZE as the original pictures.
• Rename the picture you have prepared to replace old ones with the SAME NAME AS THE OLDER PICTURES.
• Once you have renamed those pictures, put them into the folder where you found them.
C) App name :
• Modify this string : <string name="app_name">[The name you want]</string>
Example :<string name="app_name">XDA Evolved</string>
3-Now , we can start theming :
• Enter this command :
java -jar apktool.jar d [the apk name.apk]
• Then go to /res/values and open the colors.xml file
• Modify the colors
• Search for the pictures you want to change and change them as I have written above
• Open the terminal you kept open
• Enter this command :
java -jar apktool.jar b [the apk name.apk]
4-Before installing , signing :
• Open the app , click on input and browse for the apk you’ve put on your phone
• Click on the file when you’ve found it
• Click on Output and select the same apk file as in the first step
• Rename the path adding a « -signed » just before « .apk » at the end of the path.
• Select on the « key/mode » menu « platform »
• Finally , click on « sign the file » and wait till the end of the progress bar.
II-What I’ve done
• Image Size
• The Hex code of the color I want to change :
- Take a screenshot of the color(s) you want to modify
- Open the screenshot on Pipette
- Tap on the lock button and click on the color , the hex code will be displayed at the bottom
• The Hex code of the color I want to add : Same process with Pipette
• The colors I want to add :
-Background of the posts :2d2d2d
-the secondary color :c0c0c0
-Background color :212121
-Accent color :edb02d
-Primary color :353535
-The secondary color :#aaffffff
2-Editing and making new icon, etc.:
• I used gimp to resize the picture after making them.
3-Decompiling the apk file :
java -jar apktool.jar d XDALabs.apk
4-Replacing icons and other images :
5-Editing colors and the name :
<color name="accent">#ffedb02d</color> <color name="accent_translucent">#ddedb02d</color> <color name="background_dark">#ff212121</color> <color name="dialog_bg_dark">#ff212121</color> <color name="primary">#ff353535</color> <color name="primary_bg">#ff353535</color> <color name="primary_dark">#ff2b2b2b</color> <color name="search_divider_dark">#ff212121</color> <color name="search_list_results_bg_dark">#ff212121</color> <color name="secondary_text">#ff727272</color>
<color name="accent">#fffbb002</color> <color name="accent_translucent">#ddfbb002</color> <color name="background_dark">#ff47595c</color> <color name="dialog_bg_dark">#ff2d2d2d</color> <color name="primary">#ff3174f1</color> <color name="primary_bg">#ff2d2d2d</color> <color name="primary_dark">#ff3174f1</color> <color name="search_divider_dark">#ff2d2d2d</color> <color name="search_list_results_bg_dark">#ff2d2d2d</color> <color name="secondary_text">#ffc0c0c0</color>
• I opened strings.xml file and I replaced the app name line :
<string name="app_name">XDA Labs</string>
<string name="app_name">XDA Evolved</string>
6-Recompiling the new apk file :
java -jar apktool.jar b XDALabs
7-Signing the apk after install it :
8-Install the Apk :
• Install the signed version of the apk.
You can ask me on this thread about everything about the theming and I'll do my best to solve your problems, but do it in the respect and following the Forum Rules
You can go to themed XDA Labs version's thread clicking here.
And please , if you found this guide useful , press the thank button.