Android L Developer Preview で追加された UI 部品である CardView を試してみました。
動画
カードのふちが角丸（影つき）になっているのが見えますかね。。。
丸みは cardCornerRadius で指定するようです。
サンプルリソース
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="8dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardCornerRadius="8dp">
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="280dp"
android:scaleType="centerCrop" />
</android.support.v7.widget.CardView>
</LinearLayout>
あれっ？？？
角が丸いだけの View ？？？
（そうだ、yanzm 先生の Android Pattern Cookbook に載ってたカードビューをみてみよう）
Android Pattern Cookbook に載ってたカードビューのリソース
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="16dp" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/card_item_bg2"
android:orientation="vertical" >
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="@dimen/thumbnail_height"
android:contentDescription="@string/thumbnail"
android:scaleType="centerCrop" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="4dp"
android:background="@drawable/card_shadow" />
</LinearLayout>
あれっ？？？
yanzm せんせいのとコード量、ほとんど変わらないw
CardView さん...
きっと、ボクが何か勘違いしているに違いない...
あわせて読みたい
- L Developer Preview マテリアルデザインを始める - Firespeed
- Android Pattern Cookbook マーケットで埋もれないための差別化戦略 | Impress
