Tuesday, 8 May 2012

  Android TitleBar And  CustomTitleBar


This is possible to handle the titlebar and also can able to customize it in android.
We can do this via
A) Adding xml code in AndroidManifest.xml
B) Using java code by programmatically.


                                   Working in AndroidManifest.xml


Hide the Title Bar Using XML code.



If you want to hide the title bar for particular activity, use the below code in AndroidManifest.xml within the <activity> tag.


 android:theme="@android:style/Theme.Black.NoTitleBar"

Example:
     <activity
            android:name=" FirstScreen"
            android:label="@string/app_name"
            android:theme="@android:style/Theme.Black.NoTitleBar " >

 Hide the Title Bar and Status Bar Using XML code.

If you want to hide the Title Bar and Status Bar for particular activity, use the below code in AndroidManifest.xml within the <activity> tag.

android:theme="@android:style/Theme.Black.NoTitleBar.Fullscreen"

Example:
     <activity
            android:name=" FirstScreen"
            android:label="@string/app_name"
            android:theme="@android:style/Theme.Black.NoTitleBar.Fullscreen " >

Hide the Title Bar and Status Bar for entire Application Using XML code.

 If you want to hide the Title Bar and Status Bar for entire application,just use the above code in <application> tag.

Example:

 for hiding title bar:
        <application
        android:icon="@drawable/icon"
         android:label="@string/app_name"
         android:theme="@style/CustomTheme"
         android:theme="@android:style/Theme.Black.NoTitleBar" >

 for hiding title and status bar:
        <application
        android:icon="@drawable/icon"
         android:label="@string/app_name"
         android:theme="@style/CustomTheme"
         android:theme="@android:style/Theme.Black.NoTitleBar.Fullscreen" >

                Working in Java file using java code

Hide the Title Bar Using java code.

If you want to hide the title bar for particular activity, use this java code above the setContentView() method.

requestWindowFeature(Window.FEATURE_NO_TITLE);
   
                                    Custom Title Bar in Android

* Follow the steps carefully to make custom title bar
* Copy and paste the below coding in corresponding files.
* Create the new Android Project with following attributes.

Project name        : CustomTitleBars
Build Target          : Android 2.1
Application name  : CustomTitleBars
Package name      : com.custom.title.bars
Create Activity     : FirstScreen

Step 1:

Create the custom_title.xml file in res/values folder.

<resources>
       <style name="CustomTitleBars">
              <item name="android:background">#00ffff</item>
    </style>
   
    <style name="CustomTitle" parent="android:Theme">
       <item name="android:windowTitleSize">35dip</item>
        <item name="android:windowTitleBackgroundStyle">@style/CustomTitleBars</item>
    </style>
</resources>

Step 2:

Create the first_title_screen.xml file in res/values folder.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       android:orientation="horizontal"
       android:layout_width="fill_parent"
       android:layout_height="35dip"
       android:background="#00ffff" android:gravity="right">

    <Button
        android:id="@+id/btn_next"
        android:layout_width="wrap_content"
        android:layout_height="35dip"
        android:text="NEXT"/>
          
</LinearLayout>

Step 3:

Create the second_title_screen.xml file in res/values folder.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="35dip"
    android:background="#00ffff"
    android:orientation="horizontal">

    <Button
        android:id="@+id/btn_back"
        android:layout_width="wrap_content"
        android:layout_height="35dip"
        android:text="BACK" />

</LinearLayout>

Step 4:

Paste the below coding in main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/tv_screen"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#00ff00"
        android:textSize="25dip"
        android:textStyle="bold"
        android:typeface="serif" />

</LinearLayout>

Step 5:

 Paste this code in FirstScreen.java

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.Button;
import android.widget.TextView;

public class FirstScreen extends Activity {

       Button btnNext;
       TextView tvScreen;
       /** Called when the activity is first created. */
       @Override
       public void onCreate(Bundle savedInstanceState) {
              super.onCreate(savedInstanceState);

              requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
             
              setContentView(R.layout.main);
              getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,
                           R.layout.first_title_screen);
      
              tvScreen = (TextView)this.findViewById(R.id.tv_screen);
              tvScreen.setText("First Screen");
              btnNext = (Button) this.findViewById(R.id.btn_next);
              btnNext.setOnClickListener(new OnClickListener() {

                     @Override
                     public void onClick(View v) {
                           // TODO Auto-generated method stub
                           Intent intent =new Intent(FirstScreen.this,SecondScreen.class);
                           startActivity(intent);
                          
                     }
              });
       }
}

Step  6:

Create the SecondScreen.java file in src folder.

package com.custom.title.bars;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.Button;
import android.widget.TextView;

public class SecondScreen extends Activity {

       Button btnBack;
       TextView tvScreen;
       /** Called when the activity is first created. */
       @Override
       public void onCreate(Bundle savedInstanceState) {
              super.onCreate(savedInstanceState);

              requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
             
              setContentView(R.layout.main);
              getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,
                           R.layout.second_title_screen);
      
              tvScreen = (TextView)this.findViewById(R.id.tv_screen);
              tvScreen.setText("Second Screen");
              btnBack = (Button) this.findViewById(R.id.btn_back);
              btnBack.setOnClickListener(new OnClickListener() {

                     @Override
                     public void onClick(View v) {
                           // TODO Auto-generated method stub
                           finish();
                          
                     }
              });
       }
}

In Android Manifest file 

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.custom.title.bars"
    android:versionCode="1"
    android:versionName="1.0" >
    <application
        android:icon="@drawable/icon"
        android:label="@string/app_name"
        android:theme="@style/CustomTitle" >
        <activity
            android:name="FirstScreen"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name="SecondScreen" >
        </activity>
    </application>
</manifest>

Full source code for Custom Title Bars

1 comment: