안드로이드 L(롤리팝) 부터 CardView라는 UX 컴포넌트가 추가되었습니다. 하지만 여기서는 그 이전 버전에서도 사용할 수 있도록 CardView와 유사한 형태의 Drawable를 만들어보고자 합니다.

먼저 drawable 폴더에 각 xml 파일들을 작성합니다.

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>

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>

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>

ListView

<ListView
  android:cacheColorHint="@android:color/transparent"
  android:divider="@null"
  android:dividerHeight="10dp"
  android:footerDividersEnabled="true"
  android:headerDividersEnabled="true"
  android:id="@+id/listview"
  android:layout_above="@id/layout_bottom_buttons"
  android:layout_height="match_parent"
  android:layout_width="match_parent"
  android:listSelector="@android:color/transparent" />

각 Item들을 출력하는 View

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/layout_background"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:paddingLeft="15dp"
  android:paddingRight="15dp"
  android:descendantFocusability="beforeDescendants">

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="15dp"
    android:paddingBottom="15dp"
    android:paddingLeft="15dp"
    android:paddingRight="15dp"
    android:background="@drawable/selector_card_background"
    android:descendantFocusability="afterDescendants"
    android:orientation="horizontal">

    <ImageView
      android:layout_width="64dp"
      android:layout_height="64dp"
      android:layout_gravity="center_vertical"
      android:src="@drawable/footprint" />

    <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_marginLeft="15dp"
      android:orientation="vertical">

      <TextView
        android:id="@+id/tv_date"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="2016-11-02 13:30:30"
        android:textColor="@color/darkgray"
        android:textSize="14sp" />

      <TextView
        android:id="@+id/tv_data"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Beacon1 : 35"
        android:textColor="@color/black"
        android:textSize="12sp" />
    </LinearLayout>


  </LinearLayout>

</FrameLayout>