CardView使用与介绍

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/mjb00000/article/details/79384517
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.几种效果图

CardView效果图
代码如下:

<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>
展开阅读全文

没有更多推荐了,返回首页