CardView使用与介绍

1.在Android Studio工程中build.gradle中配置如下：

dependencies {
    compile fileTree(include: ['*.jar'], dir: 'libs')
    // 引用android.support.v7.CardView包
    compile 'com.android.support:cardview-v7:23.+'
}

2.CardView分析

首先浏览一下CardView源码，在CardView源码中这样介绍：

A FrameLayout with a rounded corner background and shadow（一个带圆角和阴影的布局）

public class CardView extends FrameLayout {
    ......
}

一般我们经常实现带圆角的View时都会首先想到写一个shape来实现效果，但CardView就自带了这种属性。

3.CardView属性介绍, 如下：

• CardView_cardBackgroundColor 设置背景色
• CardView_cardCornerRadius 设置圆角大小
• CardView_cardElevation 设置z轴阴影
• CardView_cardMaxElevation 设置z轴最大高度值
• CardView_cardUseCompatPadding 是否使用CompadPadding
• CardView_cardPreventCornerOverlap 是否使用PreventCornerOverlap
• CardView_contentPadding 内容的padding
• CardView_contentPaddingLeft 内容的左padding
• CardView_contentPaddingTop 内容的上padding
• CardView_contentPaddingRight 内容的右padding
• CardView_contentPaddingBottom 内容的底padding
• CardView_cardUseCompatPadding 设置内边距
• CardView_cardPreventConrerOverlap 防止内容和边角的重叠

4.具体使用：

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    card_view:cardBackgroundColor="#FFFFFF"
    card_view:cardCornerRadius="10dp">

    <!- 要展示在CardView上的子View ->
    ......

</android.support.v7.widget.CardView>

注意：使用CardView时注意”命名空间”

xmlns:card_view="http://schemas.android.com/apk/res-auto"

这句坚决不能少，否则CardView那些自定义属性就没法使用了。

5.几种效果图

代码如下：

<android.support.v7.widget.CardView    
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card:cardBackgroundColor="#7FFFD4"
    card:cardCornerRadius="10dp"
    card:cardElevation="5dp"
    card:cardUseCompatPadding="true">
    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center"
        android:padding="30dp"
        android:text="设置z轴阴影10dp"
        android:textColor="#FFFFFF" />
</android.support.v7.widget.CardView>

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card:cardBackgroundColor="#ffd700"
    card:cardCornerRadius="10dp"
    card:cardUseCompatPadding="true">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center"
        android:padding="30dp"
        android:text="设置圆角10dp"
        android:textColor="#FFFFFF" />
</android.support.v7.widget.CardView>

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center"
        android:padding="30dp"
        android:text="正常效果" />
</android.support.v7.widget.CardView>

<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"
    card:cardBackgroundColor="#ff00ff"
    card:cardUseCompatPadding="true">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:gravity="center"
        android:padding="30dp"
        android:text="设置背景"
        android:textColor="#FFFFFF" />
</android.support.v7.widget.CardView>