For creating custom Title bar in android, For that Add styles.xml in the res/values folder.
The styles.xml file contains the following code.
<?xml version="1.0" encoding="UTF-8"?>
<resources>
<style name="WindowTitleBackground" >
<item name="android:background">@android:color/transparent</item>
</style>
</resources>
Create colors.xml file in the res/values folder. Add colors that are needed for the application.
The colors.xml file contains the following code.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="orange">#ff5500</color>
<color name="white">#ffffff</color>
<color name="transparent">#00000000</color>
<color name="date_color">#999999</color>
<color name="black">#000000</color>
<color name="gray">#999999</color>
<color name="blue">#0066cc</color>
<color name="gold">#e6b121</color>
<color name="blueback">#99FFFF</color>
<color name="articlecolor">#3399FF</color>
<color name="article_title">#3399FF</color>
<color name="cachecolor">#8ad0e8</color>
<color name="red">#FF0000</color>
<color name="pink">#FF00FF</color>
<color name="green">#00FF00</color>
<color name="mycolor">#FF9900</color>
</resources>
Add themes.xml file in the res/values folder.
themes.xml file contains the following code.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="MyTheme" parent="android:Theme">
<item name="android:windowTitleSize">60px</item>
<item name="android:windowTitleBackgroundStyle">@style/WindowTitleBackground</item>
</style>
</resources>
The created style will be added into the theme file.
After creating these files open android manifest file and apply the theme into the whole application or an activity.
manifest file code
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="cm.camera.table"
android:versionCode="1"
android:versionName="1.0">
<uses-sdk android:minSdkVersion="4" />
<application android:icon="@drawable/icon" android:label="@string/app_name">
<activity android:name=".LoadImage" android:label="@string/app_name" android:screenOrientation="portrait" android:theme="@style/MyTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
The yellow highlighted code is the code for applying the created theme for an activity.
Create a layout for the custom title bar, the layout contain any android controls.
The below layout cobe is the sample layout for the custom title bar.
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="60px"
android:layout_gravity="fill_horizontal"
android:layout_width="fill_parent"
android:background="#095C9B"
android:orientation="horizontal">
<Button android:id="@+id/header_left_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="5dp"
android:layout_centerVertical="true"
android:text=" Back"
android:textColor="#000000"/>
<TextView android:id="@+id/header_text"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_toRightOf="@+id/header_left_btn"
android:layout_toLeftOf="@+id/header_right_btn"
android:text="Header Text"
android:textSize="20sp"
android:textStyle="bold"
android:textColor="#FFFFFF"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:singleLine="true" />
<Button android:id="@+id/header_right_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="5dp"
android:layout_centerVertical="true"
android:text=" Share"
android:textColor="#000000"/>
</RelativeLayout>
I used two buttons and one text view in the layout.
Add the following lines in the on create method.
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,R.layout.header);
The onCreate method in the activity will look like the below.
The yellow Highlighted line replaces the default title bar to the custom title bar.
Run the application, you will get the output like below.
The styles.xml file contains the following code.
<resources>
<style name="WindowTitleBackground" >
<item name="android:background">@android:color/transparent</item>
</style>
</resources>
Create colors.xml file in the res/values folder. Add colors that are needed for the application.
The colors.xml file contains the following code.
<resources>
<color name="orange">#ff5500</color>
<color name="white">#ffffff</color>
<color name="transparent">#00000000</color>
<color name="date_color">#999999</color>
<color name="black">#000000</color>
<color name="gray">#999999</color>
<color name="blue">#0066cc</color>
<color name="gold">#e6b121</color>
<color name="blueback">#99FFFF</color>
<color name="articlecolor">#3399FF</color>
<color name="article_title">#3399FF</color>
<color name="cachecolor">#8ad0e8</color>
<color name="red">#FF0000</color>
<color name="pink">#FF00FF</color>
<color name="green">#00FF00</color>
<color name="mycolor">#FF9900</color>
</resources>
Add themes.xml file in the res/values folder.
themes.xml file contains the following code.
<resources>
<style name="MyTheme" parent="android:Theme">
<item name="android:windowTitleSize">60px</item>
<item name="android:windowTitleBackgroundStyle">@style/WindowTitleBackground</item>
</style>
</resources>
The created style will be added into the theme file.
After creating these files open android manifest file and apply the theme into the whole application or an activity.
manifest file code
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="cm.camera.table"
android:versionCode="1"
android:versionName="1.0">
<uses-sdk android:minSdkVersion="4" />
<application android:icon="@drawable/icon" android:label="@string/app_name">
<activity android:name=".LoadImage" android:label="@string/app_name" android:screenOrientation="portrait" android:theme="@style/MyTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
The yellow highlighted code is the code for applying the created theme for an activity.
Create a layout for the custom title bar, the layout contain any android controls.
The below layout cobe is the sample layout for the custom title bar.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="60px"
android:layout_gravity="fill_horizontal"
android:layout_width="fill_parent"
android:background="#095C9B"
android:orientation="horizontal">
<Button android:id="@+id/header_left_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="5dp"
android:layout_centerVertical="true"
android:text=" Back"
android:textColor="#000000"/>
<TextView android:id="@+id/header_text"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_toRightOf="@+id/header_left_btn"
android:layout_toLeftOf="@+id/header_right_btn"
android:text="Header Text"
android:textSize="20sp"
android:textStyle="bold"
android:textColor="#FFFFFF"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:singleLine="true" />
<Button android:id="@+id/header_right_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="5dp"
android:layout_centerVertical="true"
android:text=" Share"
android:textColor="#000000"/>
</RelativeLayout>
I used two buttons and one text view in the layout.
Add the following lines in the on create method.
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE,R.layout.header);
The onCreate method in the activity will look like the below.
@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.header);
}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.header);
The yellow Highlighted line replaces the default title bar to the custom title bar.
Run the application, you will get the output like below.
Big Thaaaanks to the point and Useful..
ReplyDeleteYou need to add the below text:
create heade.xml in the res/layout
Thanks for share!!!!!!!
ReplyDeletehello need complete code
ReplyDeleteThanks for share :-)
ReplyDeleteI’m glad to find so many useful and informative data on your website. wordpress themes
ReplyDelete