CardView使用要点

CardView是一种卡片视图, 主要是以卡片形式显示内容, 让我们先看看效果吧. CardView目前是全版本支持的控件.

Maven库
compile 'com.android.support:cardview-v7:+'

资源文件

    <android.support.v7.widget.CardView        android:id="@+id/card_view"        android:layout_width="320dp"        android:layout_height="180dp"        android:layout_centerInParent="true"        android:foreground="?attr/selectableItemBackground"        android:stateListAnimator="@anim/item_raise"        app:cardCornerRadius="4dp"        app:cardElevation="4dp">        <TextView            android:id="@+id/info_text"            android:layout_width="match_parent"            android:layout_height="match_parent"            android:gravity="center"            android:text="CLWang"/>    </android.support.v7.widget.CardView>

app:cardCornerRadius表示卡片的弧度.
app:cardElevation表示阴影的深度.

点击事件

        CardView cardView = (CardView) findViewById(R.id.card_view);        cardView.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                Toast.makeText(MainActivity.this, "This is a card view!", Toast.LENGTH_LONG).show();            }        });

波纹型的选中效果.

android:foreground="?attr/selectableItemBackground"

阴影加深的选中效果

android:stateListAnimator="@anim/item_raise"

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item        android:state_enabled="true"        android:state_pressed="true">        <objectAnimator            android:duration="@android:integer/config_shortAnimTime"            android:propertyName="translationZ"            android:valueTo="8dp"            android:valueType="floatType"/>    </item>    <item>        <objectAnimator            android:duration="@android:integer/config_shortAnimTime"            android:propertyName="translationZ"            android:valueTo="0dp"            android:valueType="floatType"/>    </item></selector>

选中时, Z轴逐渐升起; 未选中时, Z轴恢复0. 动画属性支持api21+.

注意
不同版本显示效果不同时, 定制/res/value和 /res/value-v21的资源.

设计要点, CardView主要突出不同种类的卡片在一起显示, 尽量不要使用单一的模式, 如固定高度的卡片, 类似ListView的显示.

That’s all! Enjoy it!