Android How To Styling The Action Bar

The action bar provides your users a familiar and predictable way to perform actions and navigate your app. If you want to style the action bar to better fit for your brand app, you can easily do using Android's style and theme resource.

Use an Android Theme

Android includes two baseline activity themes that dictate the color for the action bar :

• Theme.Holo for a "dark" theme.
• Theme.Holo.Light for a "light" theme.

You can apply these theme to your app, you can uses your entire app or to individual activity by declaring them in your manifest file with the android:theme attribute for the <application> element or individual <activity> element.

For Example :

<application android:theme="@style/Theme.Holo.Light" ... />

If you use theme for your entire app.

and :

<activity android:theme="@style/Theme.Holo" ... /> 

If you use theme for individual activity.

Customize the Background of Action Bar

To change the action bar background, you must create a custom theme for your activity.

For Android 3.0 and higher only

Only support for Android 3.0 and higher only, you can define the action bar's background like this :

res/values/theme.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- the theme applied to the application or activity -->
    <style name="CustomActionBarTheme"
           parent="@android:style/Theme.Holo.Light.DarkActionBar">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
    </style>
    <!-- ActionBar styles -->
    <style name="MyActionBar"
           parent="@android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
        <item name="android:background">@drawable/actionbar_background</item>
    </style>
</resources>

Then apply your theme to your entire app or individual activites, you must declaration the name of theme to your activity or entire app.

Tips:You can use RGB color to create a theme, just replace the code "@drawable/actionbar_background" with RGB color. For Example :

<item name="android:background">#CCC</item>