Custom (gradient) background of ActionBar Compat

Question

I am using Action Bar Compat so that my action bar with navigation drawer was backward compatible down to API level 9 and I want to change the background of the action bar.

I copied the code from Android Developers:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- the theme applied to the application or activity -->
<style name="CustomActionBarTheme"
       parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="android:actionBarStyle">@style/MyActionBar</item>

    <!-- Support library compatibility -->
    <item name="actionBarStyle">@style/MyActionBar</item>
</style>

<!-- ActionBar styles -->
<style name="MyActionBar"
       parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
    <item name="android:background">@drawable/actionbar_background</item>

    <!-- Support library compatibility -->
    <item name="background">@drawable/actionbar_background</item>
</style>
</resources>

And here comes the problem.

When I put an image drawable or a color as the background, it works fine. However I want to define the background as a gradient shape, so my actionbar_background looks like:

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">
<gradient
        android:startColor="@color/ac_bg_start"
        android:endColor="@color/ac_bg_end"
        android:type="linear"/>
<size
        android:width="1dp"
        android:height="48dp"/>
</shape>

I want it to be repeated in horizontal way but even this results in error, in fact, very interesting error. Test device and even the emulator gets restarted when I try to run the app. I was able to catch DeadObjectException before restarting.

How should the background drawable look like?

Answer 1

I am currently working on the same task.

Here is my action_bar_bg.xml file in which I define the gradient for my action bar.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:angle="90"
        android:centerColor="@color/turquoise_action_bar"
        android:endColor="@color/dark_turquoise"
        android:startColor="@color/dark_turquoise" />
</shape>

DeadObjectException

android:shape="line" can't be used if there is a gradient inside. I tested it; my Samsung Galaxy Note 10.1 N8000 restarted, and there was a DeadObjectException.

The linear type of gradient pattern is the default value. So you don't have to declare it explicitly.

Here is my styles.xml in the values folder.

<resources>

    <!-- Base application theme. -->
    <style name="AppThemeBase" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="android:actionBarStyle">@style/PeopleCanAct</item>
        <!-- Support library compatibility -->
        <item name="actionBarStyle">@style/MyActionBar</item>
    </style>

    <style name="AppTheme" parent="AppThemeBase">
        <!-- All the customizations that are NOT specific to a particular API level can go here -->
    </style>

    <!-- ActionBar styles -->
    <style name="MyActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
        <item name="android:background">@drawable/action_bar_bg</item>
        <!-- Support library compatibility -->
        <item name="background">@drawable/action_bar_bg</item>
    </style>

</resources>

Gradient Drawable

Answer 2

I also use that sample code from Android Developer and use the gradient XML as like yours.

<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="line">

I found the different of this file between yours and mine is android:shape="line" / android:shape="rectangle".

So I try to change my rectangle to line. My app also occurs the same exception and the OS is restarted. Maybe the shape is the key point.

Answer 3

This is an example for the action bar xml:

<?xml version="1.0" encoding="utf-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:angle="180"
        android:endColor="#BF797777"
        android:startColor="#A4231E35"
        android:type="linear" />
</shape> 

Instead of using android:shape="line" , in order to avoid DeadObjectException , you can set the android:angle to 180 or 0 - the effect will be the same, that is a horizontal line gradient.

Answer 4

Another approach, without modifying styles.xml:

Here is our example GradientDrawable in res/drawable/ab_gradient.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle"
    android:useLevel="false" >

    <gradient
        android:angle="90"
        android:startColor="#000000"
        android:endColor="#FFFFFF"
        android:type="linear" />

</shape>

You can set it to action bar in your Activity's onCreate():

ActionBar actionBar = getActionBar();    
actionBar.setBackgroundDrawable(getResources().getDrawable(R.drawable.action_bar_gradient_shape));

If you use support v7 library (your case):

// make sure to import android.support.v7.app.ActionBar
ActionBar actionBar = getSupportActionBar();        
actionBar.setBackgroundDrawable(getResources().getDrawable(R.drawable.action_bar_gradient_shape));

Or if you use ActionBarSherlock:

// make sure to import com.actionbarsherlock.app.ActionBar
ActionBar actionBar = getSherlock().getActionBar();     
actionBar.setBackgroundDrawable(getResources().getDrawable(R.drawable.action_bar_gradient_shape));