How to create Action Bar for smartphone in android

Use the below layout to design your action bar.


 <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="horizontal" android:layout_width="fill_parent"
        android:layout_height="50dip" android:background="#ffbbbbbb">
        <TextView android:layout_width="wrap_content" android:layout_centerVertical="true"
                android:textColor="@color/white" android:textSize="7pt"
                android:textStyle="bold" android:layout_height="wrap_content"
                android:text="Your App" android:padding="8dp" />

        <ImageView android:layout_width="1px" android:src="#ffffffff"
                android:layout_height="wrap_content" android:text="@string/hello"
                android:id="@+id/bordertwo" android:layout_toLeftOf="@+id/refresh"
                android:layout_marginRight="12dip" android:layout_alignParentBottom="true"
                android:layout_alignParentTop="true" />

        <ImageView android:layout_width="25dip" android:src="@drawable/title_refresh"
                android:layout_height="25dip" android:text=""
                android:layout_marginRight="12dip" android:layout_centerVertical="true"
                android:id="@+id/refresh" android:layout_toLeftOf="@+id/borderone"
                android:scaleType="fitXY" />

        <ImageView android:layout_width="wrap_content" android:src="#ffffffff" android:layout_height="wrap_content"
                android:id="@+id/borderone" android:layout_alignParentTop="true"
                android:layout_marginRight="12dip" android:layout_alignParentBottom="true"
                android:layout_alignBottom="@+id/search" android:text="@string/hello"
                android:layout_toLeftOf="@+id/search" />

        <ImageView android:src="@drawable/title_search" android:text=""
                android:layout_width="25dip" android:layout_alignParentRight="true"
                android:layout_centerVertical="true" android:id="@+id/search"
                android:layout_marginRight="12dip" android:layout_height="25dip"
                android:scaleType="fitXY" />
</RelativeLayout>

How to change the background of actionbar in android

Step1: create three background image for action bar

Step2: create new style element in style.xml

<style name="actionBar" parent="android:style/Widget.Holo.ActionBar">
<item name="android:background">@drawable/bar_top_blue</item>
</style>

Step3: create new style element in style.xml to set “actionBar” style.

    <style name="CustomActionBar" parent="android:style/Theme.Holo">

<item name="android:actionBarStyle">@style/actionBar</item>

</style>
Step4: Use style element created in step3 in your activity attribute of AndroidManifest.xml

<activity android:name=".base.activity.MyActivity"
android:screenOrientation="sensorLandscape" android:theme="@style/CustomActionBar">



</activity>

How to change the tabs background color in actionbar in android

Step1 : create three background image (a)when tab is selected(b)when tab is in default state(c)when tab is focused.

Step2 : create selector xml under drawable folder.
e.g: actionbar_tabs_state_color.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_default"/>
<item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/tab_selected"/>
<!-- Focused states -->
<item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/tab_focused"/>
<item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/tab_focused"/>
<!-- Pressed -->
<item android:state_pressed="true" android:drawable="@drawable/tab_focused"/>
</selector>

Step3: create new style element in style.xml

<style name="customActionBarTabStyle">
<item name="android:background">@drawable/actionbar_tabs_state_color</item>
<item name="android:paddingLeft">14dp</item>
<item name="android:paddingRight">14dp</item>

</style>

Step4 : create new style element in style.xml to set “customActionBarTabStyle” style.

<style name="CustomActionBar" parent="android:style/Theme.Holo">

<item name="android:actionBarTabStyle">@style/customActionBarTabStyle</item>


</style>

Step5: Use style element created in step4 in your activity attribute in AndroidManifest.xml

<activity android:name=".base.activity.MyActivity"
android:screenOrientation="sensorLandscape" android:theme="@style/CustomActionBar">



</activity>

How to add custom layout in honeycomb ActionBar in android

Step1: Create your customview

e.g: sample_custom_layout.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="wrap_content">

      <Button android:visibility="visible" android:text=""

            android:id="@+id/button" android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:paddingRight="10dp" android:paddingLeft="10dp"></Button>

</LinearLayout>

Step2 : Put the below code on your activity OnCreate() method

protected void onCreate(Bundle savedInstanceState) {

            // TODO Auto-generated method stub

            super.onCreate(savedInstanceState);

ActionBar bar= getActionBar();

View actionCustomView = getLayoutInflater().inflate(

                        R.layout. sample_custom_layout,null);

            bar.setCustomView(actionCustomView, new ActionBar.LayoutParams(

                        LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT,

                        Gravity.RIGHT));

           

            int change = bar.getDisplayOptions() ^ ActionBar.DISPLAY_SHOW_CUSTOM;

            bar.setDisplayOptions(change, ActionBar.DISPLAY_SHOW_CUSTOM | ActionBar.DISPLAY_USE_LOGO);

}