首先,我们要知道cardView是android在5.0之后推出的一个界面组件,官方文档里面对什么时候用它,以及在什么情况之下使用他才能达到较好的效果,都有详细的介绍的哈,不过由于是英文,看起来还是有一点吃力哈。cardView本身是继承于FrameLayout,说明他其实也是一种布局文件,所以暂时可以理解为一种自带展示效果的一种FrameLayout布局文件。
官方原文文档
中文文档
导入库文件
在gradle中进行配置
dependencies {
...
compile 'com.android.support:cardview-v7:26.+'
}
其实android有很多自带的组件,而且界面效果都非常好。在我们的android sdk的文件夹之下,
Android\sdk\extras\android\m2repository\com\android\support
里面有很多的组件,没事的时候可以挨个研究一下。
这里我们根据的自己的版本填写自己对应的版本号就行了。
参数说明
打开CardView的源文件我们可以很清晰的找到caraView所拥有的属性以及方法。
这里我就直接找了一些。
app:cardBackgroundColor这是设置背景颜色
app:cardCornerRadius这是设置圆角大小
app:cardElevation这是设置z轴的阴影
app:cardMaxElevation这是设置z轴的最大高度值
app:cardUseCompatPadding是否使用CompatPadding
app:cardPreventCornerOverlap是否使用PreventCornerOverlap
app:contentPadding 设置内容的padding
app:contentPaddingLeft 设置内容的左padding
app:contentPaddingTop 设置内容的上padding
app:contentPaddingRight 设置内容的右padding
app:contentPaddingBottom 设置内容的底padding
最简单的基础版
<android.support.v7.widget.CardView
android:layout_margin="20dp"
android:layout_width="match_parent"
android:layout_height="200dp">
</android.support.v7.widget.CardView>
只是引用,什么都没加,效果就很low,就是一个有边框的FrameLayout的样子。
让我们稍作调整,让他好看一点。
成熟期版
<android.support.v7.widget.CardView
android:layout_margin="20dp"
android:layout_width="match_parent"
android:layout_height="300dp"
app:cardCornerRadius="20dp" //加上圆角
app:cardElevation="10dp" //加上阴影
app:cardBackgroundColor="#dcdcdc" //加上背景颜色
>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="center"
android:src="@drawable/pic"
tools:ignore="ContentDescription" />
</android.support.v7.widget.CardView>
这一次我们新增加了一些属性,让其变得更像卡片一些。
有没有觉得现在看起来要好看一些了呢!
最后我们仿照着官方文档中的那个图片做一个类似的。
看起来效果还不错是吧。
源文件已经上传,有兴趣的朋友可以看一下。
链接在此