Attend XDA's Second Annual Developer Conference, XDA:DevCon 2014!
5,737,563 Members 44,920 Now Online
XDA Developers Android and Mobile Development Forum

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

Tip us?
 
Sniper Killer
Old
(Last edited by Sniper Killer; 1st February 2014 at 10:38 PM.)
#1  
Sniper Killer's Avatar
Recognized Contributor - OP
Thanks Meter 2876
Posts: 1,248
Join Date: Dec 2012
Location: /system/build.prop
Default [GUIDE][GB]How to place a custom icon on the title bar of a certain app

Hey guys!
After some of @SpaceCaker 's modifications, we found out how to place a custom icon on the title bar of any app. You can use your app's iconfor reference. So, one of the synonyms that could be said for this guide is JellyBean Title Bar. The modification is very easythough, but the hard part is wether 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.


Quote:
Requirments :

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

Quote:
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 wether 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.
Quote:
Screenshots of both methods:

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




Quote:
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:
Select Code
<item type="id" name="imageView1">false</item>
Quote:

3.
Quote:
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 resposnible 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:
Select 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:
Select 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-mdpi.

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:
Select Code
<include android:layout_width="fill_parent" android:layout_height="50.0dip" layout="@layout/titleFAQ" />
Quote:
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:
Select 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:
Select 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:
Select 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:
Select Code
android:theme="@*android:style/Theme.Black.NoTitleBar"
After all it will look like this



Code:
Select 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)

Quote:
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
The Following 5 Users Say Thank You to Sniper Killer For This Useful Post: [ Click to Expand ]
 
SpaceCaker
Old
(Last edited by SpaceCaker; 1st February 2014 at 02:58 PM.)
#2  
SpaceCaker's Avatar
Recognized Themer / Contributor
Thanks Meter 10501
Posts: 13,116
Join Date: Mar 2011
Location: netherlands
Sweet u posted the guide :3 Good Good

If u are building app from source in a java based app or such
PHP Code:
    public void onCreate(Bundle bundle)
    {
        
super.onCreate(bundle);
        
addPreferencesFromResource(R.xml.twdevs);
        
setContentView(R.layout.twdevelopers); 
add the
PHP Code:
setContentView(R.layout.twdevelopers); 
line or such so u can have a Layout in the preferences app with
PHP Code:
 extends PreferenceActivity



and add a custom layout wich looks close to this
PHP Code:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"
              xmlns:android="http://schemas.android.com/apk/res/android" >
    <include android:layout_width="fill_parent"
        android:layout_height="50.0dip"
        layout="@layout/title" />              
    <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content">

        <ListView
            android:id="@android:id/list"
            android:layout_width="fill_parent"
            android:layout_height="345dp" />

    </LinearLayout>
 
</LinearLayout>
 

My Github Click Here
Github BroadcomCM Click Here
Github CyanoSpaceMod Click Here
Github MSR-Roms Click Here
Check My SoundCloud for my music remakes,mixes etc Click Here
Linux HP-Pavilion-G7 3.11.0-23-generic #40-Ubuntu SMP Wed Jun 4 21:05:23 UTC 2014 x86_64 x86_64 x86_64 GNU/Linux
The Following 4 Users Say Thank You to SpaceCaker For This Useful Post: [ Click to Expand ]
 
Sniper Killer
Old
(Last edited by Sniper Killer; 1st February 2014 at 03:12 PM.)
#3  
Sniper Killer's Avatar
Recognized Contributor - OP
Thanks Meter 2876
Posts: 1,248
Join Date: Dec 2012
Location: /system/build.prop
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.

Find :

Code:
Select Code
<LinearLayout android:gravity="center_vertical"
Change :

Code:
Select Code
 android:background="@drawable/title_background"
to a different png target like :

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

Code:
Select Code
android:background="@drawable/touchwiz_title_background"
And put the png on drawable-mdpi.

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:
Select Code
<ImageView android:id="@id/imageView1"
Change :

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

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

Code:
Select Code
android:background="@drawable/touchwiz_title_icon"
And then like I mentioned before put the png on drawable-mdpi


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.
Attached Files
File Type: zip JBTitleBar_Source.zip - [Click for QR Code] (16.5 KB, 23 views)
The Following 2 Users Say Thank You to Sniper Killer For This Useful Post: [ Click to Expand ]
 
iamareebjamal
Old
(Last edited by iamareebjamal; 1st February 2014 at 03:14 PM.)
#4  
iamareebjamal's Avatar
Recognized Contributor / Themer
Thanks Meter 4607
Posts: 3,581
Join Date: Aug 2012
Location: Batcave
Or just add a simple style with 9 png.

Which can be also changed as HomeDisabled as in non-launcher Activity like in ActionBar

Reserved for a simpler Guide
The Following 2 Users Say Thank You to iamareebjamal For This Useful Post: [ Click to Expand ]
 
SpaceCaker
Old
#5  
SpaceCaker's Avatar
Recognized Themer / Contributor
Thanks Meter 10501
Posts: 13,116
Join Date: Mar 2011
Location: netherlands
Quote:
Originally Posted by iamareebjamal View Post
Or just add a simple style with 9 png.

Which can be also changed as HomeDisabled as in non-launcher Activity like in ActionBar

Reserved for a simpler Guide

we do know about this one

but it didnt really always worked and also this way it makes it bit easier to layout the icon properly and bg
because there are a lot of people who try this but fail with photoshoping the icon in background.

i also said that teddy shouldnt include the third method because that would be * to complex* lol
 

My Github Click Here
Github BroadcomCM Click Here
Github CyanoSpaceMod Click Here
Github MSR-Roms Click Here
Check My SoundCloud for my music remakes,mixes etc Click Here
Linux HP-Pavilion-G7 3.11.0-23-generic #40-Ubuntu SMP Wed Jun 4 21:05:23 UTC 2014 x86_64 x86_64 x86_64 GNU/Linux
The Following User Says Thank You to SpaceCaker For This Useful Post: [ Click to Expand ]
 
Sniper Killer
Old
#6  
Sniper Killer's Avatar
Recognized Contributor - OP
Thanks Meter 2876
Posts: 1,248
Join Date: Dec 2012
Location: /system/build.prop
Quote:
Originally Posted by iamareebjamal View Post
Or just add a simple style with 9 png.

Which can be also changed as HomeDisabled as in non-launcher Activity like in ActionBar

Reserved for a simpler Guide
The guide on the OP is more stable and working proof. Also, more detailed, with opportunity of changing the title's bar background and the title's bar icon.
 
iamareebjamal
Old
(Last edited by iamareebjamal; 1st February 2014 at 03:50 PM.)
#7  
iamareebjamal's Avatar
Recognized Contributor / Themer
Thanks Meter 4607
Posts: 3,581
Join Date: Aug 2012
Location: Batcave
Quote:
Originally Posted by Sniper Killer View Post
The guide on the OP is more stable and working proof. Also, more detailed, with opportunity of changing the title's bar background and the title's bar icon.
lol. I don't know what you mean by "STABLE", so I can't speak on that

About working proof, what can be better working proof than Cosmic v3

Title Bar's background and icon both can be changed by that method

Don't misunderstand me, just trying to share another method with people.

PS - You will want to include (if not already) that editing AndroidManifest.xml of system app will require to sign it, and if you want it working on your device, you'll have to disable signature check from service.
 
Vishnu pv
Old
#8  
Vishnu pv's Avatar
Recognized Themer
Thanks Meter 1741
Posts: 678
Join Date: Apr 2013
Location: God's Own Country
Usefull guide for users and also new rising themers Keep it up

The Following User Says Thank You to Vishnu pv For This Useful Post: [ Click to Expand ]
Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes