Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Custom background color for selected item with "activatedBackgroundIndicator" Navigation Drawer

This question has been asked a lot on SO, and I have referenced all the answers. I am still left with the default Holo blue background for selected items on my navigation drawer. I am new to Java and I am confused about the "context" part of .setAdapter().
My project is a single Activity with multiple fragments swapped using the nav drawer.

Here is my adapter:

mDrawerListView.setAdapter(new ArrayAdapter<String>(
            // First parameter - Context
            getActionBar().getThemedContext(),
            // Second parameter - Layout for the row
            R.layout.fragment_navigation_drawer_list_item,
            // Third parameter - ID of the TextView to which the data is written
            android.R.id.text1,
            // Forth - the Array of data
            new String[]{
                    getString(R.string.title_section1),
                    getString(R.string.title_section2),
                    getString(R.string.title_section3),
                    getString(R.string.title_section4),
            }));
    mDrawerListView.setItemChecked(mCurrentSelectedPosition, true);

The context here comes from the "pre-cooked" navigation drawer in Android Studio. I thought this would be the answer Navigation Drawer item background colour for selected item. So I changed my context to getActivity().getBaseContext(),, but that didn't change anything.

My theme (styles.xml):

<resources>
    <style name="AppBaseTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
        <!-- API 14 theme customizations can go here. -->
        <item name="android:actionBarStyle">@style/ActionBar</item>
    </style>

    <!-- Navigation Drawer styling -->
    <style name="NavDrawerItemSelected" parent="AppBaseTheme">
        <item name="android:activatedBackgroundIndicator">@drawable/activated_background</item>
    </style>
</resources>

activated_background in 'drawables' dir:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_activated="true" android:drawable="@color/green" />
    <item android:state_selected="true" android:drawable="@color/green" />
    <item android:state_pressed="true" android:drawable="@color/green" />
    <item android:state_checked="true" android:drawable="@color/green" />        
    <item android:drawable="@android:color/transparent" />
</selector>

I don't know which of those above states is supposed to be used, so I added all of them I could find.
Finally, when an item is selected mDrawerListView.setItemChecked(position, true); is called.
Everything works, except for the custom theme styling. (min API = 11, testing on API 17 AVD)

like image 396
Flash Avatar asked Apr 16 '14 14:04

Flash


2 Answers

I have run into this exact problem. The issue is that the background of R.layout.fragment_navigation_drawer_list_item is what needs to be changed to your drawable. Simply add android:background="@drawable/activated_background" to the layout.

like image 156
telkins Avatar answered Oct 13 '22 10:10

telkins


I wasn't able to find any full clear answer to this question, so here it is:

Step 1. Specify the list item layout your adapter will use, in this example we're specifying:R.layout.fragment_navigation_drawer_list_item

Like so:

mDrawerListView.setAdapter(new ArrayAdapter<String>(
        // First parameter - Context
        getActionBar().getThemedContext(),
        // Second parameter - Layout for the row
        R.layout.fragment_navigation_drawer_list_item,
        // Third parameter - ID of the TextView to which the data is written
        android.R.id.text1,
        // Forth - the Array of data
        new String[]{
                getString(R.string.title_section1),
                getString(R.string.title_section2),
                getString(R.string.title_section3),
                getString(R.string.title_section4),
        }))`

Step 2. Create and customize fragment_navigation_drawer_list_item.xml to specify a drawable that will have a selector like so: android:background="@drawable/activated_background" Full example:

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/text1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceListItemSmall"
    android:gravity="center_vertical"
    android:paddingStart="?android:attr/listPreferredItemPaddingStart"
    android:paddingEnd="?android:attr/listPreferredItemPaddingEnd"
    android:minHeight="?android:attr/listPreferredItemHeightSmall"
    android:background="@drawable/activated_background" />

Step 3. Create and customize the selector in your activated_background.xml file just like in the question, it will look like this:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_activated="true" android:drawable="@color/green" />
    <item android:state_selected="true" android:drawable="@color/green" />
    <item android:state_pressed="true" android:drawable="@color/green" />
    <item android:state_checked="true" android:drawable="@color/green" />
    <item android:drawable="@android:color/transparent" />
</selector>
like image 39
u2tall Avatar answered Oct 13 '22 11:10

u2tall