CardView

Material Design

谷歌官网：https://www.google.com/design/spec/material-design/introduction.html

中文翻译：http://www.mobileui.cn/material-design/

CardView

CardView 也是 Android 5.0 的新控件，这控件其实就是一个卡片。CardView继承的是FrameLayout，所以就是一个容器，只不过可以添加自己定义的属性，实现一些扁平化的效果。

1.自定义属性

<resources>
    <declare-styleable name="CardView">
        <!--背景颜色-->
        <attr name="cardBackgroundColor" format="color"/>
        <!--边缘弧度数-->
        <attr name="cardCornerRadius" format="dimension"/>
        <!--阴影高度-->
        <attr name="cardElevation" format="dimension"/>
        <!--最大阴影高度-->
        <attr name="cardMaxElevation" format="dimension"/>
        <!--设置内边距，API v21+ 的版本和之前的版本仍具有一样的计算方式-->
        <attr name="cardUseCompatPadding" format="boolean"/>
        <!--在 v20和之前的版本中添加内边距，这个属性是为了防止卡片内容和边角的重叠-->
        <attr name="cardPreventCornerOverlap" format="boolean"/>
        <!--下面是卡片边界距离内部的距离-->
        <attr name="contentPadding" format="dimension"/>
        <attr name="contentPaddingLeft" format="dimension"/>
        <attr name="contentPaddingRight" format="dimension"/>
        <attr name="contentPaddingTop" format="dimension"/>
        <attr name="contentPaddingBottom" format="dimension"/>
    </declare-styleable>
</resources>

2.使用步骤

1. 引进 CardView的库文件，引入步骤如图所示

   

2. 在布局文件中引入CardView控件，并添加属性

   • 在根布局中加入自定义的命名空间的代码 xmlns:card_view="http://schemas.android.com/apk/res-auto"

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

• CardView控件

<android.support.v7.widget.CardView 
    android:layout_width="match_parent"
    android:layout_height="200dp"
    card_view:cardBackgroundColor="#ffff00"
    card_view:cardCornerRadius="5dp"
    card_view:cardElevation="10dp"
    card_view:cardPreventCornerOverlap="true"
    card_view:cardUseCompatPadding="true"
    card_view:contentPadding="10dp">

      <TextView
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:gravity="center"
          android:text="This is a CardView" />
 </android.support.v7.widget.CardView>

3.属性

card_view:cardElevation 阴影的大小
card_view:cardMaxElevation 阴影最大高度
card_view:cardBackgroundColor 卡片的背景色
card_view:cardCornerRadius 卡片的圆角大小
card_view:contentPadding 卡片内容于边距的间隔
card_view:contentPaddingBottom
card_view:contentPaddingTop
card_view:contentPaddingLeft
card_view:contentPaddingRight
card_view:contentPaddingStart
card_view:contentPaddingEnd
card_view:cardPreventConrerOverlap 在V20和之前的版本中添加内边距，这个属性为了防止内容和边角的重叠
card_view:cardUseCompatPadding 设置内边距，V21+的版本和之前的版本仍旧具有一样的计算方式