Sunday, 26 December 2010

Android Custom title bar

Custom title bar is one of the basic needs for developers since it gives applications a better look and feel. Also we can align the title bar with application theme and colors. For example, i found Opera browser use a RED background theme for their title bar to align with their company theme. We can also show the company/application logo along with the title text. Here i will explain how i did for my projects. I would appreciate if anyone knows better ways please do post a link.

So lets start with a custom_title_bar.xml >created in /res/layout directory. Here ImageView hold the icon and TextView holds the title bar text. I did not set any background color here which i will set in my custom styles. But keep a layout height = 45dip which will be the title bar height.



Next Step -

Now create a custom_titlebar_style.xml in /res/values folder. Here I made a custom title background color style which I used like Facebook Title color [#3b5998]. And create another title bar size style of “45dip”. Now we are done.



Now add this custom style name in Manifest.xml file in tag. Like below -


We just need to do add 2 lines of code in onCreate() method. First add first line before setContentView(R.layout.your_layout.xml) method. Later set the integer value for a feature using the value (a layout xml file) of the custom title bar. Below shows -



Here how the custom title bar should look like. I have used Facebook style theme color which i like most -

And we are done. One thing, if we want no title bar? Specially game apps like it. Use the following code before calling setContentView() method-

/**
* If you want no title bar then use the following code:
* requestWindowFeature(Window.FEATURE_NO_TITLE);
* getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
* WindowManager.LayoutParams.FLAG_FULLSCREEN);
**/

You can get the Eclipse project here [API v8] – https://github.com/jnoras/com.jnoras.android

2 comments:

cktdesigner said...

Was able to get my custom title bar to work, but the overall appearance/theme changes with the code line 5 of the custom_titlebar_style.xml file This is due to the theme changing from the default (Holo) to just plain "Theme"

If I change the parent to “android.Theme.Holo” (to get the original theme back) I get an error at run-time error:

“You cannot combine custom titles with other title features”

Does the “Holo” theme have different items that must be modified?

Unknown said...

nice writeup

Post a Comment