Highlight entire item in Cards UI ListView

Question

I have a ListView where I've implemented a Cards UI-type look to it. If an item in the ListView is in the "selected" or "pressed" state, there is a white border around the item. I would like the entire view to have the blue color, but not sure how to achieve that:

Single item in the ListView

ListView item layout

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

    <FrameLayout 
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >

        <RelativeLayout
            android:id="@+id/itemLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="0dp"
            android:layout_marginRight="0dp"
            android:layout_marginTop="4dp"
            android:layout_marginBottom="4dp"
                android:background="@drawable/bg_cards_ui"
           >

            <TextView  
                android:id="@+id/title"
                android:layout_alignParentTop="true"
                android:paddingBottom="4dip"
            />

            <TextView  
                android:id="@+id/summary"
                android:paddingBottom="4dip"
                android:layout_below="@id/text"
            />

            <TextView  
                android:id="@+id/siteName"
                android:layout_below="@id/summary"
            />

            <TextView  
                android:id="@+id/date"
                android:layout_below="@id/summary"
            />
        </RelativeLayout>
    </FrameLayout>

bg_card_ui.xml

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

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle" android:dither="true">

            <corners android:radius="2dp"/>

            <solid android:color="#ccc" />

        </shape>
    </item>
    <item android:bottom="2dp">
        <shape android:shape="rectangle" android:dither="true">

            <corners android:radius="2dp" />

            <solid android:color="@android:color/white" />

            <padding 
                android:bottom="8dp"
                android:left="8dp"
                android:right="8dp"
                android:top="8dp" 
            />
        </shape>
    </item>
    <item>
        <selector>  
            <item android:state_pressed="true" android:drawable="@color/my_blue_color" />

            <item android:state_selected="true" android:state_pressed="false" android:drawable="@color/my_blue_color" />

            <item android:state_activated="true" android:state_selected="false" android:state_pressed="false" android:drawable="@color/my_blue_color" />

            <item android:state_selected="false" android:state_pressed="false" android:drawable="@android:color/transparent" /> 
        </selector>
    </item>
</layer-list>

score 1 · Accepted Answer · edited May 23 '17 at 10:30

Check this out:ListView - Highlight sub layout of item. I've implemented exactly what I think you're looking to do.

Basically, for what you've got, you need to have the selector reference a background xml file in the "drawable" property of the each item. You would need at least two background xml files, one for normal state and one for pressed which has the color changes you want. Should work after that.

Highlight entire item in Cards UI ListView

1 Answers1