How to make selector and adding it to your List or ListFragment

Aman Gupta

22 December 2016

In this blog,
I have shown the method to change the background Color of the ListFragment on the basis of the current states of the list using custom Selector(Color State List Resource).

First of all, I will give the small introduction about the selector.

What is Selector

Actually, Selector is nothing but the XML element <selector> which is used to describe the state list in an XML file.

When state change, the state list is traversed top to bottom and the first item that matches the current state will be used.

SYNTAX:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:color="hex_color"
        android:state_pressed=["true" | "false"]
        android:state_focused=["true" | "false"]
        android:state_selected=["true" | "false"]
        android:state_checkable=["true" | "false"]
        android:state_checked=["true" | "false"]
        android:state_enabled=["true" | "false"]
        android:state_window_focused=["true" | "false"] />
</selector>

<?xml version="1.0" encoding="utf-8"?>

<item

android:color="hex_color"

android:state_pressed=["true" | "false"]

android:state_focused=["true" | "false"]

android:state_selected=["true" | "false"]

android:state_checkable=["true" | "false"]

android:state_checked=["true" | "false"]

android:state_enabled=["true" | "false"]

android:state_window_focused=["true" | "false"] />

</selector>

You can make it into the drawable package.

<selector>: This must be the root element. Contains one or more <item> elements.

attributes:

<item>:

Defines a color to use for certain states, as described by its attributes. Must be a child of a<selector> element.

attributes:

android:color: The color is specified with an RGB value and optional alpha channel.
android:state_pressed: This item should be used when the object is pressed.
android:state_focused: This item should be used when the object is focused.
android:state_selected: This item should be used when the object is selected.
android:state_checkable: This item should be used when the object is checkable.
android:state_checked: This item should be used when the object is checked.
android:state_enabled: This item should be used when the object is enabled.
android:state_window_focused: This item should be used when the application window has focus.

How to Apply it on the list or ListFragment

If you want the default selector in ListFragment then assign it as your row layout background.

android:background="?android:attr/activatedBackgroundIndicator"

1	android:background="?android:attr/activatedBackgroundIndicator"

Or create our selector file

Step 1: Create a selector file

list_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" android:exitFadeDuration="@android:integer/config_longAnimTime">

    <item android:drawable="@color/accent_color" android:state_pressed="true" />
    <!--<item android:drawable="@color/dark_primary_color" android:state_focused="true" android:state_selected="true" />-->
    <!-- Selected -->
    <item android:drawable="@drawable/focused" android:state_focused="true" />

    <!-- Pressed -->
    <item android:drawable="@drawable/selected" android:state_selected="true" />

</selector>

<?xml version="1.0" encoding="utf-8"?>

</selector>

Step 2: Apply it on to the List or ListFragment

Use setSelector(int) for apply selector on the list

If you want to apply this on to the ListView Simply write

ListView listView = (ListView) findViewById(R.id.listView);
listView.setChoiceMode(ListView.CHOICE_MODE_SINGLE);
listView.setSelector(R.drawable.list_selector);

ListView listView = (ListView) findViewById(R.id.listView);

listView.setChoiceMode(ListView.CHOICE_MODE_SINGLE);

listView.setSelector(R.drawable.list_selector);

OR If you want to apply this on to the ListFragment Simply write

public void setActivateOnItemClick(boolean activateOnItemClick) {
        // When setting CHOICE_MODE_SINGLE, ListView will automatically
        // give items the 'activated' state when touched.
//    	 Toast.makeText(getActivity(), "setActivateOnItemClick", Toast.LENGTH_SHORT).show();
        getListView().setChoiceMode(activateOnItemClick ? ListView.CHOICE_MODE_SINGLE : ListView.CHOICE_MODE_NONE);
        getListView().setSelector(R.drawable.list_selector);
    }

public void setActivateOnItemClick(boolean activateOnItemClick) {

// When setting CHOICE_MODE_SINGLE, ListView will automatically

// give items the 'activated' state when touched.

// Toast.makeText(getActivity(), "setActivateOnItemClick", Toast.LENGTH_SHORT).show();

getListView().setChoiceMode(activateOnItemClick ? ListView.CHOICE_MODE_SINGLE : ListView.CHOICE_MODE_NONE);

getListView().setSelector(R.drawable.list_selector);

}