android-actionbar icon indicating copy to clipboard operation
android-actionbar copied to clipboard

dropdown background colors aren't visible

Open LorneLaliberte opened this issue 14 years ago • 2 comments

The action bar is using actionbar_background_dropdown_start and actionbar_background_dropdown_end for the background of the dropdown list itself, but that background isn't visible because each item's background is drawn above it.

(Well, I suppose it would be if you used a translucent color. :)

Specifically, right now it's using actionbar_background_item_pressed_start and actionbar_background_item_pressed_end for each item in the dropdown list.

This is because drawable/actionbar_list_item_background.xml is using actionbar_btn_normal and actionbar_btn_pressed for the state list.

Suggestion:

(1) Add drawable/actionbar_list_item_normal.xml:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="@color/actionbar_background_dropdown_item_start"
        android:endColor="@color/actionbar_background_dropdown_item_end"
        android:angle="-90"/>
</shape>

(2) Add drawable/actionbar_list_item_pressed.xml:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="@color/actionbar_background_dropdown_item_pressed_start"
        android:endColor="@color/actionbar_background_dropdown_item_pressed_end"
        android:angle="-90"/>
</shape>

(3) Modify drawable/actionbar_list_item_background.xml as follows:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Non focused states -->
    <item
        android:state_focused="false"
        android:state_selected="false"
        android:state_pressed="false"
        android:drawable="@drawable/actionbar_list_item_normal"
        />
    <item
        android:state_focused="false"
        android:state_selected="true"
        android:state_pressed="false"
        android:drawable="@drawable/actionbar_list_item_pressed"
        />

    <!-- Focused states -->
    <item
        android:state_focused="true"
        android:state_selected="false"
        android:state_pressed="false"
        android:drawable="@drawable/actionbar_list_item_pressed"
        />
    <item
        android:state_focused="true"
        android:state_selected="true"
        android:state_pressed="false"
        android:drawable="@drawable/actionbar_list_item_pressed"
        />

    <!-- Pressed -->
    <item
        android:state_pressed="true"
        android:drawable="@drawable/actionbar_list_item_pressed"
        />

    <!-- Default -->
    <item
        android:drawable="@drawable/actionbar_list_item_normal"
        />
</selector>

(4) Add the four new colors to the colors.xml file:

<resources>
    <color name="actionbar_divider">#8B1A1A</color>
    <color name="actionbar_title">#FFFFFF</color>
    <color name="actionbar_subtitle">#E0E0E0</color>
    <color name="actionbar_background_start">#8B1A1A</color>
    <color name="actionbar_background_end">#CD2626</color>
    <color name="actionbar_background_dropdown_start">#8B1A1A</color>
    <color name="actionbar_background_dropdown_end">#B02121</color>
    <color name="actionbar_background_dropdown_item_start">#8B1A1A</color>
    <color name="actionbar_background_dropdown_item_end">#B02121</color>
    <color name="actionbar_background_dropdown_item_pressed_start">#FF7F00</color>
    <color name="actionbar_background_dropdown_item_pressed_end">#EE7600</color>
    <color name="actionbar_background_item_pressed_start">#FF7F00</color>
    <color name="actionbar_background_item_pressed_end">#EE7600</color>
    <color name="actionbar_tab_bar_background">#999999</color>
</resources>

Note: you only need to add 2 colors if you don't want the list background colors to be configurable.

LorneLaliberte avatar Jul 05 '11 21:07 LorneLaliberte

Ah -- there's a problem with my suggested fix: in List Navigation mode, the dropdown item background becomes the action bar's background, since it's used for the selected item shown in the spinner.

So there's the added caveat that you would need to use a SpinnerAdapter that provides a different view for the spinner itself.

Hmmm.

Yeah, it works if I add layout/actionbar_list_mode_title.xml like so:

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/actionbar_list_mode_title"
    android:layout_width="fill_parent"
    android:layout_height="@dimen/actionbar_height"
    android:gravity="center_vertical"
    android:paddingLeft="10dip"
    android:paddingRight="10dip"
    android:textSize="16dip"
    android:textStyle="bold"
    android:textColor="@color/actionbar_title"
    android:lines="1"
    android:background="@drawable/actionbar_btn"
    android:focusable="true"
    />

...and then create the SpinnerAdapter like this:

            ArrayAdapter adapter = ArrayAdapter.createFromResource(context, R.array.activity_titles, R.layout.actionbar_list_mode_title);
            adapter.setDropDownViewResource(R.layout.actionbar_list_dropdown_item);
            SpinnerAdapter listAdapter = adapter;

LorneLaliberte avatar Jul 05 '11 21:07 LorneLaliberte

Thank you. Yes we definitely need a way to configure the dropdown and this looks good. I haven't tested it yet but I hopefully find the time to do so soon.

johannilsson avatar Jul 09 '11 07:07 johannilsson