前言:
android5.0发布的material design是一整套设计思想,同时也发布了相关的新的控件,CardView顾名思义,就像一个卡片一样,使用起来十分简单,主要是xml布局的时候需要针对不同的诸多属性进行配置即可。
使用起来很简单,build进项目中:
compile 'com.android.support:cardview-v7:25.2.0'
后面的版本号最好和其他引用的版本号一致。
我们来看看有哪些属性:
app:contentPadding 设置内容的padding
app:contentPaddingLeft 设置内容的左padding
app:contentPaddingTop 设置内容的上padding
app:contentPaddingRight 设置内容的右padding
app:contentPaddingBottom 设置内容的底padding
app:cardBackgroundColor 这是设置背景颜色
app:cardCornerRadius 这是设置圆角大小
app:cardElevation 这是设置z轴的高度
app:cardMaxElevation 这是设置z轴的最大高度值
app:cardUseCompatPadding 设置内边距,V21+的版本和之前的版本仍旧具有一样的计算方式
app:cardPreventCornerOverlap 在V20和之前的版本中添加内边距,这个属性为了防止内容和边角的重叠
像这些以app开头的命名控件的属性主要是考虑到5.0一下系统的兼容性,其他android开头的属性和一般的控件类似。CardView类似FrameLayout,Z轴的高度产生的阴影效果是其最大特色,其他效果通过shape出drawable可以实现。
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
app:cardCornerRadius="4dp"
app:contentPadding="10dp"
app:cardPreventCornerOverlap="true">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="@+id/fruit_image"
android:scaleType="centerCrop"
android:layout_width="match_parent"
android:layout_height="120dp"/>
<TextView
android:id="@+id/fruit_name"
android:layout_margin="5dp"
android:layout_gravity="center_horizontal"
android:textSize="16sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.v7.widget.CardView>
简单效果为:
推荐大家用这些符合material design设计的控件。
CardView是很简单,比较容易掌握的控件,下一篇将会将到RecycleView,作为取代listview的强大控件,强烈推荐使用。