[GUIDE][GB]How to place a custom icon on the title bar of a certain app

Search This thread

Sniper Killer

Senior Member
Dec 16, 2012
1,307
3,104
Tirana, Albania
Hey guys!
After some of @SpaceCaker 's modifications, we found out how to place a custom icon on the title bar of any app. Its not a style method but a whole new different method which is much workingproof. You can use your app's icon for reference. So, one of the synonyms that could be said for this guide is JellyBean Title Bar. The modification is very easy though, but the hard part is whether you find the right file which controls the title bar on a specified window. But, I can help you in this.
After following the guide, if you didn't understand it properly, just give me the app and I will place the custom JB title bar on it as per your request.


Requirments :

- Basic XML knowledge
- APK Multi TOOL/Whichever decompiling tool
- Sources on attachments


There are 2 different methods to make this.
First method means that the custom windows are located on layouts folder.
Second method means that the windows are located on XML folder.

The first method is very good and is bugfree, but unfortunately it depends on the app. If whether he has the windows located
on layouts folder or XML folder
The second method is not fully bugfree. If the app's windows are located on XML folder then the title bar is going to be scrolled with the chooserboxes too. The only way to fix it is to create a layout for the window.

Screenshots of both methods:

One of HelpCentre (1st method) example given below and the second of DSP manager (2nd method).

1w96.png
j9mc.png


nqft.png
nqft.png


1. Decompile the app you want to place the custom title bar. I will take a custom built app "HelpCentre.apk"
2. Download the sources on the attachments and place the layout "title" on the layout folder
and the custom id on ids.xml file on values folder.
Code:
<item type="id" name="imageView1">false</item>
3.
a) In the first method the windows are located on the layouts. So see the following :
Go to layouts folder and now find the layout which is responsible for the first window

Let's use an example :

I have credits.xml file on the layout folder. Now on this window, i want to place a custom title bar.
To do this i should include the custom title on layout folder on the first lines.

To make this, paste this code after xmlns:android="http://schemas.android.com/apk/res/android">

Code:
<include android:layout_width="fill_parent" android:layout_height="50.0dip" layout="@layout/title" />

Be sure to place it on the correct order.

I also, have FAQ.xml too. If i want edit this file too, there will be no title bar as on the end of the guide we will add
NoTitleBar theme on AndroidManifest.xml So, therefore i have to place the same value on it too.

Again, after the code xmlns:android="http://schemas.android.com/apk/res/android"> place this one :

Code:
<include android:layout_width="fill_parent" android:layout_height="50.0dip" layout="@layout/title" />

What if you want to use a custom title for the another window?
Easy, we are going to create another exact file as title.xml just that we will rename it different, like titleFAQ.xml.
On this XML we will change the android:icon value. We can use whatever value for the icon. For example,
"@drawable/ic_credits" Then, we will paste the png you want to place on the drawable-ldpi.

Now in the FAQ.xml file you want to place another icon title we should change the layout target so according to what I did so far on the file, this is the target i should place.

Code:
<include android:layout_width="fill_parent" android:layout_height="50.0dip" layout="@layout/titleFAQ" />

b) In the second method the windows are located on the XML folder. So follow below :
Go to XML folder and now find the XML which is responsible for the window.

So I will use the same example.

So let's say that the Credits.xml is on the XML folder. Now instead of including <include android:layout_width="fill_parent"......
you should include this code below xmlns:android="http://schemas.android.com/apk/res/android">

Code:
<CheckBoxPreference android:layout="@layout/title" android:title="Help Centre" android:key="Help_title_Centre" />

Android:title is the name of the title bar. You can set it to whatever name you want. Same goes with android:key.

To use another icon for the another title bar which is located on FAQ.xml like i mentioned before, change

Code:
<CheckBoxPreference android:layout="@layout/titleFAQ" android:title="Help Centre" android:key="Help_title_Centre" />

4. Now the final step is to go to AndroidManifest.xml and after the specified activity place the NoTitleBar theme

I edited Credits.xml and FAQ.xml so let's find their activity in there.

Code:
        <activity android:name="Credits">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
            </intent-filter>
        </activity>
        <activity android:name="FAQ">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
            </intent-filter>
        </activity>

I now will add the theme value on both activities. This is the code
Code:
android:theme="@*android:style/Theme.Black.NoTitleBar"
After all it will look like this



Code:
        <activity android:theme="@*android:style/Theme.Black.NoTitleBar" android:name="Credits">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
            </intent-filter>
        </activity>
        <activity android:theme="@*android:style/Theme.Black.NoTitleBar" android:name="FAQ">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
            </intent-filter>
        </activity>

Now we're done working. :)

5. Recompile the apk
6. Sign it (Always sign if you edit AndroidManifest.xml)


Credits :

Full credits goes to the most amazing themer I have ever seen, @SpaceCaker!
He made many works for Touchwiz Resurrection ROM and I have based the guide upon that modifications just that I have edited
the code and fully explained it.
Also, Touchwiz Resurrection Team members @Vishnu pv and @radichification for their support!


Enjoy!


Regards,
Teddy
 

Sniper Killer

Senior Member
Dec 16, 2012
1,307
3,104
Tirana, Albania
B]If you want to change the background target you should change something on title.xml or any other title xml you have created for your window.[/B]

Find :

Code:
<LinearLayout android:gravity="center_vertical"

Change :

Code:
 android:background="@drawable/title_background"

to a different png target like :

Code:
android:background="@drawable/ics_title_background"

or :

Code:
android:background="@drawable/touchwiz_title_background"

And put the png on drawable-ldpi.

Also, I have included a normal icon for the title bar, but you can change it anytime, just replace it with another icon.
If you want to change the target of the icon find :


Code:
<ImageView android:id="@id/imageView1"

Change :

Code:
android:background="@drawable/title_icon"

To :

Code:
android:background="@drawable/ics_title_icon"

Or :

Code:
android:background="@drawable/touchwiz_title_icon"

And then like I mentioned before put the png on drawable-ldpi

I don't exactly know the title bar's size on LDPI but i think 50.0dip is alright. If someone tries it and the title bar is overlapped just reduce its size on the layout or XML on xml folder that you have edited.

Currently on the zip source I have included a Touchwiz title background as that's what I have atm, but you can get another one ICS or JB themed. I will provide them later. As per now, only touchwiz title background is available.

Download ZIP on attachments.

Don't forget to put correct credits if you are going to include this into your ROM/MOD/Theme. ;)
 

Attachments

  • JBTitleBar_Source.zip
    16.1 KB · Views: 206
Last edited:

MuSaddiq

Senior Member
Aug 24, 2013
652
946
Wow! Very nice guide... Btw you have stated that "Download ZIP on attachments" but i dont find any zip attached here.
 
  • Like
Reactions: Sniper Killer

Sniper Killer

Senior Member
Dec 16, 2012
1,307
3,104
Tirana, Albania
Wow! Very nice guide... Btw you have stated that "Download ZIP on attachments" but i dont find any zip attached here.

Whut? o_O

I thought I uploaded xD
Or maybe it just is unavailable on tapatalk to be downloaded. Let me check it.

EDIT : Oh damn.. Internet had might been the problem. Wait will add the source as soon as possible. Sorry for the inconvience"

EDIT 2 : Added attachments. Sorry for inconvience again!

Sent from my GT-S5830i using Tapatalk 2
 
Last edited:

Typhus_

Senior Member
Hello!

Thank you for this guide. I was looking exactly for something like this because I've added a title_bar, on framework-res.apk, with the "Settings.apk" icon that, not only, added the title bar on Settings.apk but other apps receive the same title bar icon as well, which is lame.

And so, I've decided to follow your guide, not to change the title bar on every app that received the same title bar, because of the cahnges I've made on on framework, but simply to change it on Settings.apk, because that was my primary goal since the beginning.

All windows xml files are on xml folder. So I had to go with second method. Faced the expected bug (title bar scrolls with the window).

The second method is not fully bugfree. If the app's windows are located on XML folder then the title bar is going to be scrolled with the chooserboxes too. The only way to fix it is to create a layout for the window.

Err...could you be more specific? I'm sorry but I didn't quite understand how to fix it.

Can you help me?

Thank you!
 

Sniper Killer

Senior Member
Dec 16, 2012
1,307
3,104
Tirana, Albania
Hello!

Thank you for this guide. I was looking exactly for something like this because I've added a title_bar, on framework-res.apk, with the "Settings.apk" icon that, not only, added the title bar on Settings.apk but other apps receive the same title bar icon as well, which is lame.

And so, I've decided to follow your guide, not to change the title bar on every app that received the same title bar, because of the cahnges I've made on on framework, but simply to change it on Settings.apk, because that was my primary goal since the beginning.

All windows xml files are on xml folder. So I had to go with second method. Faced the expected bug (title bar scrolls with the window).



Err...could you be more specific? I'm sorry but I didn't quite understand how to fix it.

Can you help me?

Thank you!

Actually, creating a new layout for a random window tab requires creating new smalis something not easy to do. You could try to do some experiments and tests and follow any possible guide for it. I cannot help at the moment as I have really been busy with school and my personal stuff. Sorry! :/
 

san122

Senior Member
Jan 20, 2013
1,238
1,593
Unavailable.
You should replace the icon with activity_title_bar.9.png on framework-res.apk/res/drawable-xdpi/. The png which you are going to replace must be a 9 patch png and also must be renamed to "activity_title_bar".

In our case its deawable-ldpi or mdpi in most of the roms instead of xdpi.:thumbup::thumbup::thumbup:

Sent from my GT-S5360 using Tapatalk 2
 
Last edited:

SpaceCaker

Senior Member
Mar 26, 2011
13,545
10,904
netherlands
www.youtube.com
actually it doesnt really matter if u place pngs in xhdpi or hdpi.

only they need the proper size ofhdpi

this way we can also use a lot of xhdpi pngs on our little devices without resizing

why?
android very clever

they have their own resizing already inside :) only png needs proper size for its dpi.



Sent from my S500 using xda app-developers app
 

GSculerlor

Senior Member
Oct 23, 2013
441
89
Malang
How to resize title bar ?

Sent from my GT-S5360 using xda app-developers app
 

Attachments

  • uploadfromtaptalk1396398955942.jpg
    uploadfromtaptalk1396398955942.jpg
    14.8 KB · Views: 58

san122

Senior Member
Jan 20, 2013
1,238
1,593
Unavailable.
How to resize title bar ?

Sent from my GT-S5360 using xda app-developers app

If you placed rhis title bar only in settings then you need to add attribute windowtitlesize in your style.
If you did this via framework then open res/values/styles.xml abd search windowtitlesize and increase its value.
50.0 dip will look good for your titlebar.

Sent from my GT-S5360 using Tapatalk 2
 
  • Like
Reactions: GSculerlor

Top Liked Posts

  • There are no posts matching your filters.
  • 8
    Hey guys!
    After some of @SpaceCaker 's modifications, we found out how to place a custom icon on the title bar of any app. Its not a style method but a whole new different method which is much workingproof. You can use your app's icon for reference. So, one of the synonyms that could be said for this guide is JellyBean Title Bar. The modification is very easy though, but the hard part is whether you find the right file which controls the title bar on a specified window. But, I can help you in this.
    After following the guide, if you didn't understand it properly, just give me the app and I will place the custom JB title bar on it as per your request.


    Requirments :

    - Basic XML knowledge
    - APK Multi TOOL/Whichever decompiling tool
    - Sources on attachments


    There are 2 different methods to make this.
    First method means that the custom windows are located on layouts folder.
    Second method means that the windows are located on XML folder.

    The first method is very good and is bugfree, but unfortunately it depends on the app. If whether he has the windows located
    on layouts folder or XML folder
    The second method is not fully bugfree. If the app's windows are located on XML folder then the title bar is going to be scrolled with the chooserboxes too. The only way to fix it is to create a layout for the window.

    Screenshots of both methods:

    One of HelpCentre (1st method) example given below and the second of DSP manager (2nd method).

    1w96.png
    j9mc.png


    nqft.png
    nqft.png


    1. Decompile the app you want to place the custom title bar. I will take a custom built app "HelpCentre.apk"
    2. Download the sources on the attachments and place the layout "title" on the layout folder
    and the custom id on ids.xml file on values folder.
    Code:
    <item type="id" name="imageView1">false</item>
    3.
    a) In the first method the windows are located on the layouts. So see the following :
    Go to layouts folder and now find the layout which is responsible for the first window

    Let's use an example :

    I have credits.xml file on the layout folder. Now on this window, i want to place a custom title bar.
    To do this i should include the custom title on layout folder on the first lines.

    To make this, paste this code after xmlns:android="http://schemas.android.com/apk/res/android">

    Code:
    <include android:layout_width="fill_parent" android:layout_height="50.0dip" layout="@layout/title" />

    Be sure to place it on the correct order.

    I also, have FAQ.xml too. If i want edit this file too, there will be no title bar as on the end of the guide we will add
    NoTitleBar theme on AndroidManifest.xml So, therefore i have to place the same value on it too.

    Again, after the code xmlns:android="http://schemas.android.com/apk/res/android"> place this one :

    Code:
    <include android:layout_width="fill_parent" android:layout_height="50.0dip" layout="@layout/title" />

    What if you want to use a custom title for the another window?
    Easy, we are going to create another exact file as title.xml just that we will rename it different, like titleFAQ.xml.
    On this XML we will change the android:icon value. We can use whatever value for the icon. For example,
    "@drawable/ic_credits" Then, we will paste the png you want to place on the drawable-ldpi.

    Now in the FAQ.xml file you want to place another icon title we should change the layout target so according to what I did so far on the file, this is the target i should place.

    Code:
    <include android:layout_width="fill_parent" android:layout_height="50.0dip" layout="@layout/titleFAQ" />

    b) In the second method the windows are located on the XML folder. So follow below :
    Go to XML folder and now find the XML which is responsible for the window.

    So I will use the same example.

    So let's say that the Credits.xml is on the XML folder. Now instead of including <include android:layout_width="fill_parent"......
    you should include this code below xmlns:android="http://schemas.android.com/apk/res/android">

    Code:
    <CheckBoxPreference android:layout="@layout/title" android:title="Help Centre" android:key="Help_title_Centre" />

    Android:title is the name of the title bar. You can set it to whatever name you want. Same goes with android:key.

    To use another icon for the another title bar which is located on FAQ.xml like i mentioned before, change

    Code:
    <CheckBoxPreference android:layout="@layout/titleFAQ" android:title="Help Centre" android:key="Help_title_Centre" />

    4. Now the final step is to go to AndroidManifest.xml and after the specified activity place the NoTitleBar theme

    I edited Credits.xml and FAQ.xml so let's find their activity in there.

    Code:
            <activity android:name="Credits">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN" />
                </intent-filter>
            </activity>
            <activity android:name="FAQ">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN" />
                </intent-filter>
            </activity>

    I now will add the theme value on both activities. This is the code
    Code:
    android:theme="@*android:style/Theme.Black.NoTitleBar"
    After all it will look like this



    Code:
            <activity android:theme="@*android:style/Theme.Black.NoTitleBar" android:name="Credits">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN" />
                </intent-filter>
            </activity>
            <activity android:theme="@*android:style/Theme.Black.NoTitleBar" android:name="FAQ">
                <intent-filter>
                    <action android:name="android.intent.action.MAIN" />
                </intent-filter>
            </activity>

    Now we're done working. :)

    5. Recompile the apk
    6. Sign it (Always sign if you edit AndroidManifest.xml)


    Credits :

    Full credits goes to the most amazing themer I have ever seen, @SpaceCaker!
    He made many works for Touchwiz Resurrection ROM and I have based the guide upon that modifications just that I have edited
    the code and fully explained it.
    Also, Touchwiz Resurrection Team members @Vishnu pv and @radichification for their support!


    Enjoy!


    Regards,
    Teddy
    3
    B]If you want to change the background target you should change something on title.xml or any other title xml you have created for your window.[/B]

    Find :

    Code:
    <LinearLayout android:gravity="center_vertical"

    Change :

    Code:
     android:background="@drawable/title_background"

    to a different png target like :

    Code:
    android:background="@drawable/ics_title_background"

    or :

    Code:
    android:background="@drawable/touchwiz_title_background"

    And put the png on drawable-ldpi.

    Also, I have included a normal icon for the title bar, but you can change it anytime, just replace it with another icon.
    If you want to change the target of the icon find :


    Code:
    <ImageView android:id="@id/imageView1"

    Change :

    Code:
    android:background="@drawable/title_icon"

    To :

    Code:
    android:background="@drawable/ics_title_icon"

    Or :

    Code:
    android:background="@drawable/touchwiz_title_icon"

    And then like I mentioned before put the png on drawable-ldpi

    I don't exactly know the title bar's size on LDPI but i think 50.0dip is alright. If someone tries it and the title bar is overlapped just reduce its size on the layout or XML on xml folder that you have edited.

    Currently on the zip source I have included a Touchwiz title background as that's what I have atm, but you can get another one ICS or JB themed. I will provide them later. As per now, only touchwiz title background is available.

    Download ZIP on attachments.

    Don't forget to put correct credits if you are going to include this into your ROM/MOD/Theme. ;)
    2
    Wow! Very nice guide... Btw you have stated that "Download ZIP on attachments" but i dont find any zip attached here.

    Whut? o_O

    I thought I uploaded xD
    Or maybe it just is unavailable on tapatalk to be downloaded. Let me check it.

    EDIT : Oh damn.. Internet had might been the problem. Wait will add the source as soon as possible. Sorry for the inconvience"

    EDIT 2 : Added attachments. Sorry for inconvience again!

    Sent from my GT-S5830i using Tapatalk 2
    1
    Great Job Bro. Awesome Guide :)
    1
    How to resize title bar ?

    Sent from my GT-S5360 using xda app-developers app

    If you placed rhis title bar only in settings then you need to add attribute windowtitlesize in your style.
    If you did this via framework then open res/values/styles.xml abd search windowtitlesize and increase its value.
    50.0 dip will look good for your titlebar.

    Sent from my GT-S5360 using Tapatalk 2