[Theme Making] Tutorial for theming beginners

Search This thread

blinqipa

Senior Member
Aug 12, 2012
943
450
Prizren
2a9ph10.jpg

Hello guys ,in this tutorial I'm going to show you main steps to make a CM11 Theme , compatible with the newest theme engine :) .
I'll provide as much help as I can , stating here that I'm a themer for only two week , I started theming with @EnricoD who really helped me and guided me through this way .
So let's start off :)
Requirements:
* There's a template available to download on GitHub , made by elelinux .But @EnricoD made it simpler , thank him :) , also support elelinux by getting his theme Great Freedom on the Play Store
https://drive.google.com/file/d/0By2Nq4_gBuTQWktfb2xTc2dGR1U/edit?usp=sharing
It is pretty stable , and good enough to make a complete theme .
*Download Android Studio , which is going to be used to compile the Great Freedom project , and make it available as .apk format to install on your ROM.
http://developer.android.com/sdk/installing/studio.html
*Android Studio won't work without the JAVA JDK , which you can download in the link below :
http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
*You MUST have a ROM which includes the newest CM Theme Manager (T-Mobile Theme Manager) firstly introduced in the CM11S .
*Working brain
*PC, with a decent internet speed , believe me we had enough difficulties with enricocid downloading that android studio on a slow internet :/ .
*Time and Patience .Patience because you're going to test the theme you made many times .
You can ask questions , I know how it feels to be a beginner , so don't worry I , @EnricoD , and other users here will do their best to help you ;)
 
Last edited:

blinqipa

Senior Member
Aug 12, 2012
943
450
Prizren
1st Steps on theme making

Here we are , assuming that you have downloaded the Android Studio , the template , and set them properly .
What are we going to work on ?
We are going to work on the template , but know that you won't touch anything except the assets folder .
When you go to that folder (assets ) you'll see a bunch of folders .
The one you need for UI theming is overlays folder .
Let's say you are going to theme Paranoid Android or CM (it doesn't really matter , however they differ !) , you'll get the SystemUI.apk from the ROM.zip (exactly here : ROM/System/Priv-app) , decompile(I'll cover you here too ) it and you'll get another folder called systemUI filled with FOLDERS
:eek:
How it looks :
5kq1xw.png

Then edit whatever you want (except the .9.png's , I'll also cover that for you).In my case I have edited all the photos (.png's) with Photoshop CS6

29qmouu.png

I'm done with editing the drawable-xxhdpi , you may edit whichever folder you want , drawable-xhdpi etc.
Then I go to the template/GreatFreedom-cm-11.0/Assets/overlays/ and create a folder there with the name | com.android.systemui | and create another folder inside the com.android.systemui named res and then copy the whole folder you have themed in the SystemUI , in my case it is drawable-xxhdpi .

15z40va.png

If you want to edit drawable-xhdpi or any folder for the systemUI , you need to create a folder with identical name in the overlays/com.android.systemUI .
Then if you want to edit framework-res , continue with the same steps (decompile >edit>create a folder in overlays named | android | )
Understand the logic , every part of the app has a special name , which you can find it in the AndroidManifest.xml of the app you decompile , here's an example :

fkmp1c.png


So understand , example : you want to edit the XXXXXXXX.apk , you decompile it , get it's name path in the AndroidManifest.xml , and create a folder in the overlays with the name you took in the AndroidManifest.xml .(I'll take some main system apps path names and will give them to you )
Simple right?
Now we're getting into a simpler step , building the .apk with Android Studio
 
Last edited:

blinqipa

Senior Member
Aug 12, 2012
943
450
Prizren
Building the .apk with the Android Studio

Open up the Android Studio .
Then click File -> Import Project... then locate where the template is .
166fx4n.png


288scpf.png


And then compile the project
34hto2t.png

Hint : you may use Ctrl + Shift + F9 combo to compile it .
Then get the .apk , found here :
2u6ea88.png

Install it , and that's it , you got a theme now ;)
 
Last edited:

blinqipa

Senior Member
Aug 12, 2012
943
450
Prizren
Filepaths to some main packages

Names to the main packages filepath :
android (framework-res.apk)
com.android.dialer (Dialer.apk)
com.android.email (Email.apk)
com.android.keyguard (Keyguard.apk , lockscreen theming)
com.android.settings (Settings.apk)
com.android.systemui (SystemUI.apk)


You may ask for another one , I'd be happy to help you :)
 
Last edited:

blinqipa

Senior Member
Aug 12, 2012
943
450
Prizren
Reserved

Credits :
@elelinux for the template he provided , he sacrificed maybe hours and hours for us .
@EnricoD for providing the simplified template.zip .Half of this thread is his , he guided me greatly and patiently throughout this process .
@ibanez7 for his great tutorial on how to decompile an .apk
CyanogenMod team , for making a theme manager for us :).
And everyone that guided me through this way :)
 
Last edited:
  • Like
Reactions: Alessandro1010

blinqipa

Senior Member
Aug 12, 2012
943
450
Prizren
Reserved

What is decompiling ?
Decompiling is a process , in which you get every part of an app (.apk) , it is so simple , where you only need basic knowledge on Command Prompt (CMD.exe) , as I said , I got to cover you with a simple tutorial :
http://xdaforums.com/showthread.php?t=2251719

How can I edit .9.png's ?
They're same as any .png file , but if you edit it , you MUSTN'T touch /color the black parts/corners ,leave those parts black.
 
Last edited:
  • Like
Reactions: Alessandro1010

Schoat333

Senior Member
Sep 3, 2010
339
94
NE Ohio
I've never used Android studio to build a Theme, always did it the old school ways. Does it also sign it, and can you use your own key?
 

Schoat333

Senior Member
Sep 3, 2010
339
94
NE Ohio
Not sure what you mean by key , but Android Studio is a small part of this tutorial , just to make the compiling , which is a fairly easy step to do .

Sorry, I should have been more specific. In order to install an application from with in Android, it has to be signed. Generally, you would sign it with the test keys that Google provides, and that would work. In order to put an item in the Play store, you have to use your own Keys tho. I'm just curious if the Android studio does this signing step.
 

blinqipa

Senior Member
Aug 12, 2012
943
450
Prizren
Sorry, I should have been more specific. In order to install an application from with in Android, it has to be signed. Generally, you would sign it with the test keys that Google provides, and that would work. In order to put an item in the Play store, you have to use your own Keys tho. I'm just curious if the Android studio does this signing step.

Probably , I'm not a user of Android Studio , except that I use it for Theme Compiling .
I've heard that Android Studio lets you do so many things to make it available and compatible with Play Store , like it let's you choose whether the app to be mature or whatever .
 

Top Liked Posts

  • There are no posts matching your filters.
  • 6
    2a9ph10.jpg

    Hello guys ,in this tutorial I'm going to show you main steps to make a CM11 Theme , compatible with the newest theme engine :) .
    I'll provide as much help as I can , stating here that I'm a themer for only two week , I started theming with @EnricoD who really helped me and guided me through this way .
    So let's start off :)
    Requirements:
    * There's a template available to download on GitHub , made by elelinux .But @EnricoD made it simpler , thank him :) , also support elelinux by getting his theme Great Freedom on the Play Store
    https://drive.google.com/file/d/0By2Nq4_gBuTQWktfb2xTc2dGR1U/edit?usp=sharing
    It is pretty stable , and good enough to make a complete theme .
    *Download Android Studio , which is going to be used to compile the Great Freedom project , and make it available as .apk format to install on your ROM.
    http://developer.android.com/sdk/installing/studio.html
    *Android Studio won't work without the JAVA JDK , which you can download in the link below :
    http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
    *You MUST have a ROM which includes the newest CM Theme Manager (T-Mobile Theme Manager) firstly introduced in the CM11S .
    *Working brain
    *PC, with a decent internet speed , believe me we had enough difficulties with enricocid downloading that android studio on a slow internet :/ .
    *Time and Patience .Patience because you're going to test the theme you made many times .
    You can ask questions , I know how it feels to be a beginner , so don't worry I , @EnricoD , and other users here will do their best to help you ;)
    5
    1st Steps on theme making

    Here we are , assuming that you have downloaded the Android Studio , the template , and set them properly .
    What are we going to work on ?
    We are going to work on the template , but know that you won't touch anything except the assets folder .
    When you go to that folder (assets ) you'll see a bunch of folders .
    The one you need for UI theming is overlays folder .
    Let's say you are going to theme Paranoid Android or CM (it doesn't really matter , however they differ !) , you'll get the SystemUI.apk from the ROM.zip (exactly here : ROM/System/Priv-app) , decompile(I'll cover you here too ) it and you'll get another folder called systemUI filled with FOLDERS
    :eek:
    How it looks :
    5kq1xw.png

    Then edit whatever you want (except the .9.png's , I'll also cover that for you).In my case I have edited all the photos (.png's) with Photoshop CS6

    29qmouu.png

    I'm done with editing the drawable-xxhdpi , you may edit whichever folder you want , drawable-xhdpi etc.
    Then I go to the template/GreatFreedom-cm-11.0/Assets/overlays/ and create a folder there with the name | com.android.systemui | and create another folder inside the com.android.systemui named res and then copy the whole folder you have themed in the SystemUI , in my case it is drawable-xxhdpi .

    15z40va.png

    If you want to edit drawable-xhdpi or any folder for the systemUI , you need to create a folder with identical name in the overlays/com.android.systemUI .
    Then if you want to edit framework-res , continue with the same steps (decompile >edit>create a folder in overlays named | android | )
    Understand the logic , every part of the app has a special name , which you can find it in the AndroidManifest.xml of the app you decompile , here's an example :

    fkmp1c.png


    So understand , example : you want to edit the XXXXXXXX.apk , you decompile it , get it's name path in the AndroidManifest.xml , and create a folder in the overlays with the name you took in the AndroidManifest.xml .(I'll take some main system apps path names and will give them to you )
    Simple right?
    Now we're getting into a simpler step , building the .apk with Android Studio
    3
    Building the .apk with the Android Studio

    Open up the Android Studio .
    Then click File -> Import Project... then locate where the template is .
    166fx4n.png


    288scpf.png


    And then compile the project
    34hto2t.png

    Hint : you may use Ctrl + Shift + F9 combo to compile it .
    Then get the .apk , found here :
    2u6ea88.png

    Install it , and that's it , you got a theme now ;)
    3
    Filepaths to some main packages

    Names to the main packages filepath :
    android (framework-res.apk)
    com.android.dialer (Dialer.apk)
    com.android.email (Email.apk)
    com.android.keyguard (Keyguard.apk , lockscreen theming)
    com.android.settings (Settings.apk)
    com.android.systemui (SystemUI.apk)


    You may ask for another one , I'd be happy to help you :)
    1
    Reserved

    Credits :
    @elelinux for the template he provided , he sacrificed maybe hours and hours for us .
    @EnricoD for providing the simplified template.zip .Half of this thread is his , he guided me greatly and patiently throughout this process .
    @ibanez7 for his great tutorial on how to decompile an .apk
    CyanogenMod team , for making a theme manager for us :).
    And everyone that guided me through this way :)