Create a custom background for list view item

Question

I have ListView (a derived JazzyListView) that is here in the main layout of my activity :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/lib/com.toto.toto"
android:id="@+id/main"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@color/background" >

<com.twotoasters.jazzylistview.JazzyListView
    android:id="@+id/list"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:clickable="true"
    app:effect="cards"
    app:max_velocity="0"
    app:only_animate_fling="false"
    app:only_animate_new_items="false"
     />

</RelativeLayout>

The main layout sets a color background.

For my list, I use items with this layout :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
android:background="@color/item_background" >

<TextView
    android:id="@+id/name"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginRight="15dp" />
...

</RelativeLayout>

Here @color/item_background has not the same value that @color/background. So my main layout has a background color specific and list items also.

With that method, when I click on items in my list, there is no selected background state and there is no the classic background selected applied on my list.

Someone would know how I can create a custom selector (perhaps ?) or other thing to have a custom color for my items and also that when I click on item the classic selected background effect be applied ?

Thanks for your help.

Sylvain

2Dee 2Dee · Accepted Answer · 2014-01-17T16:33:56

You first need to create a custom selector that you will use as background for your list items, something similar to the below :

item_background_selectable.xml (to be created in a drawable folder)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"
    android:exitFadeDuration="@android:integer/config_shortAnimTime">
    <item android:state_pressed="true"
        android:drawable="@color/item_background_pressed" />

    <item android:drawable="@android:color/item_background" />
</selector>

then use that custom selector in your list item layout :

android:background="@drawable/item_background_selectable"

Hope this helps ;-)

Create a custom background for list view item

1 Answers