1. The first thing you should do is to switch off the default title. You can do this easily by specifying in your AndroidManifest.xml file that do not intend to use it.
<?xml version="1.0" encoding="utf-8"?>Here, in the application tag, set the theme of your app to use the NoTitleBar theme.
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.beanie.samples.titlewidget" android:versionCode="1"
android:versionName="1.0">
<application android:icon="@drawable/icon" android:label="@string/app_name"
android:theme="@android:style/Theme.NoTitleBar">
<activity android:name=".TitleWidgetActivity"
android:label="@string/app_name">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
<uses-sdk android:minSdkVersion="4" />
</manifest>
2. Create a title_widget.xml which would be the custom layout for your title bar. You can technically add any number of widgets here and finally display it with your custom title. As an example, we will add an ImageView, a TextView and a ProgressBar here.
3. Create a TitleWidget.java class which extends LinearLayout(you can use any Layout) which loads this layout file and exposes methods to modify the contents of the widgets.
4. Add the TitleWidget class as the first view in all your activity layouts’ files to display your custom title bar.
5. Now, in your activity, you can initialize this TitleWidget as any view, since it is a LinearLayout now, and can control the contents of all the widgets.<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <com.beanie.samples.titlewidget.TitleWidget android:id="@+id/titleWidget" android:layout_width="fill_parent" android:layout_height="wrap_content"> </com.beanie.samples.titlewidget.TitleWidget> </LinearLayout>
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// Initialize title Widget
TitleWidget titleWidget = (TitleWidget)
findViewById(R.id.titleWidget);
// Call the methods to change the underlying widgets
titleWidget.setTitle("My Custom Title");
titleWidget.setIcon(R.drawable.icon);
titleWidget.showProgressBar();
titleWidget.hideProgressBar();
}
Now you have your own custom title. On the surface, it doesn’t actually feel like a title bar, and yes, it isn’t. It’s just a custom view, that you are trying to make it look like a title bar. Remember!! We switched off the titles by specifying that our app’s theme to “NoTitleBar”.
You can find the whole source code here.
