android 5.x CardView的使用

1.CardView是什么

CardView是android5.X新出的组件，顾名思义，卡片视图，视觉效果非常棒，使用起来也非常简单。它可以作为父控件使用，在里面添加子控件。CardView继承自FrameLayout。

2. CardView能干什么

1. 自带阴影效果，可设置阴影宽度

2. 自带圆角效果，可设置圆角大小

先看看效果图：

怎么样，很炫酷吧！下面我们来讲讲它的用法。

3. 基本用法

3.1 添加依赖

在build.gradle中加入

dependencies {
	compile 'com.android.support:cardview-v7:23.2.0'
}

3.2 编写xml文件

<android.support.v7.widget.CardView 
	android:id="@+id/card_view"
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:layout_gravity="center"
	android:layout_margin="15dp"
	card_view:cardCornerRadius="15dp"
	card_view:cardElevation="3dp"
	card_view:cardUseCompatPadding="true"
	card_view:contentPadding="10dp">
<LinearLayout
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:orientation="vertical">
<ImageView
	android:id="@+id/image"
	android:layout_width="match_parent"
	android:layout_height="300dp"
	android:background="@drawable/image" />
<TextView
	android:id="@+id/info_text"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:layout_gravity="bottom|center_horizontal"
	android:layout_marginTop="20dp"
	android:gravity="center"
	android:text="我是可爱的猫咪～"
	android:textSize="16sp" />
</LinearLayout>
</android.support.v7.widget.CardView>

很简单吧？你可以在CardView中添加别的你想添加的控件，这里只有一个Textview。CardView有哪些属性，我们来看看它的values.xml文件中写了什么。

	<color name="cardview_shadow_start_color">#37000000</color> <!-- 阴影开始的颜色（前面两位为透明度） -->
	<color name="cardview_shadow_end_color">#03000000</color> <!-- 阴影结束的颜色 -->
	<dimen name="cardview_compat_inset_shadow">1dp</dimen>
	<dimen name="cardview_default_elevation">2dp</dimen> <!-- 默认阴影高度 -->
	<dimen name="cardview_default_radius">2dp</dimen> <!-- 默认卡片圆角角度 -->

	<!-- declare里面的，我们可以通过代码设置或者配置xml -->
	<declare-styleable name="CardView">
   	<attr format="color" name="cardBackgroundColor"/>  <!-- CardView背景 -->
    <attr format="dimension" name="cardCornerRadius"/> <!-- 卡片圆角角度 -->
    <attr format="dimension" name="cardElevation"/> <!-- 阴影高度 -->
    <attr format="dimension" name="cardMaxElevation"/> <!-- 阴影高度最大值（当cardElevation大于cardMaxElevation时，cardElevation=cardMaxElevation） -->
   <attr format="boolean" name="cardUseCompatPadding"/> <!-- 小于Lollipop的版本，增加额外的padding去绘制阴影，默认值时false，Lollipop及以后的版本设置为true就ok -->
    	<attr format="boolean" name="cardPreventCornerOverlap"/> <!-- 小于Lollipop的版本，添加内边距，防止内容和边角的重叠。默认值为true，可以不用管 -->
    <attr format="dimension" name="contentPadding"/> <!-- 子控件距离CardView的距离，以下都是 -->
    <attr format="dimension" name="contentPaddingLeft"/> 
    <attr format="dimension" name="contentPaddingRight"/>
    <attr format="dimension" name="contentPaddingTop"/>
    <attr format="dimension" name="contentPaddingBottom"/>
</declare-styleable>

<style name="CardView">
    <item name="cardBackgroundColor">@color/cardview_light_background</item>
    <item name="cardCornerRadius">@dimen/cardview_default_radius</item>
    <item name="cardElevation">@dimen/cardview_default_elevation</item>
    <item name="cardMaxElevation">@dimen/cardview_default_elevation</item>
    <item name="cardUseCompatPadding">false</item>
    <item name="cardPreventCornerOverlap">true</item>
</style>
<style name="CardView.Dark">
    <item name="cardBackgroundColor">@color/cardview_dark_background</item>
</style>
<style name="CardView.Light">
    <item name="cardBackgroundColor">@color/cardview_light_background</item>
</style>

declare-styleable 里面，每一个attr都是xml中可配置的。我们自己写自定义控件，如果想通过xml来配置该属性，就可以这么写。然后，在代码中这样来获取：

TypedArray a = context.obtainStyledAttributes(attrs, styleable.CardView, defStyleAttr, style.CardView_Light); float radius = a.getDimension(styleable.CardView_cardCornerRadius, 0.0F); a.recycle();

明白了吧？这是题外话，不多说。

4. 注意事项

    在低于 sdk 21 的版本中，用cardElevation来设置阴影大小。

    21及以后的版本，用elevation 。

转载于:https://my.oschina.net/u/2421076/blog/701534