Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ListView Item shadow + custom selector

I want to drop shadow at ListView item and also apply custom selector. But i don't know how to apply them at the same time..

Here is shadow.xml

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item >
        <shape android:shape="rectangle">
              <solid android:color="@android:color/darker_gray" />
        </shape>
    </item>
     <item 
         android:right="1dp" 
         android:bottom="2dp">        
        <shape android:shape="rectangle">
              <solid android:color="@android:color/white"/>
        </shape>
     </item>         
</layer-list> 

And custom selector:

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

I have tried to apply selector to whole ListView android:listSelector="@drawable/selector.xml" and shadow to ListView item android:background="@drawable/shadow.xml" But in this case ListView item will have shadow but won't react to touch.

Thank you in advance

like image 730
Avan Avatar asked Jun 26 '13 15:06

Avan


1 Answers

I've found solution. The reason why seletor doesn't appear is Android ListView structure. If you set background to List ItemView it overlaps Selector, so you can't see it. Solution is to make ItemView background transparent on Click.

Here is listview_item_shadow.xml:

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
              <solid android:color="@android:color/darker_gray" />
        </shape>
    </item>
     <item 
         android:right="1dp" 
         android:bottom="2dp">        
        <shape android:shape="rectangle">
              <solid android:color="@android:color/white"/>
        </shape>
     </item>         
</layer-list>

Now you should use it in selector for ItemView! - listview_item_backgroundstate.xml You need to set listview_item_backgroundstate.xml as background to your ListView item

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@android:color/transparent"></item>
    <item android:state_selected="true" android:drawable="@android:color/transparent"></item>
    <item android:state_focused="true" android:drawable="@android:color/transparent"></item>
    <item android:drawable="@drawable/listview_item_shadow"></item>
</selector>

And at last you have to set custom_selector.xml as in ListView. android:listSelector="@drawable/custom_selector.xml"

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

For more info read this awesome tutorial

like image 88
Avan Avatar answered Oct 05 '22 12:10

Avan