CODEWITHSUNDEEP
androidandroid-layoutlistviewandroid-listview
Pixel
Pixel

Reputation: 1976

Specific listView with Android

How can i make a listView like the picture on the post ? I don't want to use external library, I want to replicate this Flat Effect, with spaces between the items.

Listview

Upvotes: 0

Views: 226

Answers (1)

Piyush
Piyush

Reputation: 18923

There are few steps to implement this view without using third party library.

1) Make one xml file in drawable folder for make this type of view named layer_card_background.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="#CABBBBBB" />

        <corners android:radius="2dp" />
    </shape>
</item>
<item
    android:bottom="2dp"
    android:left="0dp"
    android:right="0dp"
    android:top="0dp">
    <shape android:shape="rectangle" >
        <solid android:color="@android:color/white" />

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

</layer-list>

2) If you wanna a implement change background after select on list items then you also need to make another xml file in drawable folder named layer_card_background_selected.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="#CABBBBBB" />

        <corners android:radius="2dp" />
    </shape>
</item>
<item
    android:bottom="2dp"
    android:left="0dp"
    android:right="0dp"
    android:top="0dp">
    <shape android:shape="rectangle" >
        <solid android:color="#CCCCCC" />

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

</layer-list>

3) Make final result xml file in which your both xml file will be included for selector named selector_card_background.xml

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

    <item android:drawable="@drawable/layer_card_background_selected" android:state_pressed="true"/>
    <item android:drawable="@drawable/layer_card_background"/>

 </selector>

4) Make your own custom adapter and apply background for layout 

  android:background="@drawable/selector_card_background"

Upvotes: 1

Related Questions