CardView 是 Google 官方发布 MD 风格卡片布局控件,开发者可以很方便的使用它将布局做成卡片效果,其继承自 FrameLayout布局,并在其基础上添加了圆角和阴影等效果。
具体属性如下:
CardView_cardBackgroundColor 设置背景色
CardView_cardCornerRadius 设置圆角大小
CardView_cardElevation 设置z轴阴影
CardView_cardMaxElevation 设置z轴最大高度值
CardView_cardUseCompatPadding 为 android 5.0 及以上版本的增加padding值来显示阴影效果,默认为false
设置内边距,V21+的版本和之前的版本具有一样的计算方式。
CardView_cardPreventCornerOverlap 是取消android 5.0 以下版本的padding ,默认为true
在V20和之前的版本中添加内边距,这个属性为了防止内容和边角的重叠
CardView_contentPadding 内部边距,子View与CardView的距离
CardView_contentPaddingLeft 内部左侧边距
CardView_contentPaddingTop 内部顶部边距
CardView_contentPaddingRight 内部右侧边距
CardView_contentPaddingBottom 内部底部边距
使用:
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardBackgroundColor="@color/colorAccent"
app:cardUseCompatPadding="true"
app:cardPreventCornerOverlap="true"
app:contentPadding="10dp"
app:cardElevation="5dp"
app:cardCornerRadius="10dp"
app:cardMaxElevation="10dp"
android:foreground="?android:selectableItemBackground"
android:clickable="true">
<!--添加自己的布局-->
</android.support.v7.widget.CardView>
具体介绍:
1,CardView_cardUseCompatPadding 为 android 5.0 及以上版本的增加padding值来显示阴影效果,默认为false
在Android 5.0及以下的系统中,CardView会添加一个额外的padding来绘制阴影,但是在5.0以上的系统中是没有这个padding的,是直接绘制阴影。
所以设置这个属性仅仅是对5.0以上的CardView有作用。
设置为false时, CardView不会专门去添加padding来绘制阴影(5.0以上系统)。
设置为true时,5.0以上的CardView会和5.0以下的保持一致,添加padding后绘制阴影。
如下图:android 8.0,可以看到,属性设为true时,图片四周有一圈白色空白,即为padding,
2,CardView_cardPreventCornerOverlap 取消android 5.0 以下版本的padding ,默认为true
在5.0以下,CardView不会裁剪卡片的边界来获得圆角(根据测试情况,我的理解是不裁剪content来获得圆角),同时,CardView会给卡片内容添加一个padding,来让内容不和圆角重叠。可以设置app:cardPreventCornerOverlap属性来选择是否添加这个padding。
所以这个属性只在Android5.0以下起作用。
所以设置为true,也就是添加padding,使content不与圆角重叠。
设置为false,不添加padding,content与圆角重叠,圆角被覆盖。
android 4.4 手机展示:设为true,很明显的看到图片周围的的padding,
所以在使用cardView,一般都会添加这两个属性:
app:cardPreventCornerOverlap="false"
app:cardUseCompatPadding="true"
为了让手机在android各个版本保持一致。
3,设置内边距:‘
CardView_contentPadding 内部边距,子View与CardView的距离
CardView_contentPaddingLeft 内部左侧边距
CardView_contentPaddingTop 内部顶部边距
CardView_contentPaddingRight 内部右侧边距
CardView_contentPaddingBottom 内部底部边距
使用 android:padding="10dp" 等设置cardView的padding值,是无效的,因为CardView 重写了这个方法,看源码可以知道,里面是空实现,所以设置padding值就只能使用 app:contentPadding="10dp" 等属性
4,设置背景色
同理:设置background 背景色 也是一样的道理
CardView_cardBackgroundColor 设置背景色
android:background="" 是无效的,
需要使用: app:cardBackgroundColor="" 来设置背景色
5,CardView点击效果:
使用 属性
android:foreground="?android:selectableItemBackground"
android:clickable="true"
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_margin="20dp"
app:cardPreventCornerOverlap="false"
app:cardUseCompatPadding="true"
app:cardCornerRadius="10dp"
app:cardElevation="5dp"
android:foreground="?android:selectableItemBackground"
android:clickable="true">
点击CardView ,5.0以上 会出现 水波纹效果,5.0以下 是简单的变暗效果