简介 :
CardView 是Android5.0推出来的新控件,同样遵循Material Design 扁平化的风格, 通常使用于卡片类型带圆角的UI布局,起来立体感明显,效果很好,由于是5.0推出的控件,为了兼容性,需要在app下 build.gradle下添加依赖
compile 'com.android.support:cardview-v7:24.2.1
基本使用
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:cardview="http://schemas.android.com/apk/res-auto"
cardview:cardElevation="5dp"
cardview:cardCornerRadius="6dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.CardView>
cardview:cardElevation
表示cardView 的阴影的 高度
cardview:cardCornerRadius
表示cardView 的圆角的边缘弧度数
- 拓展使用 属性介绍
cardBackgroundColor : 设置CardView的背景颜色
cardMaxElevation : 设置最大高度
cardUseCompatPadding :设置内边距
cardPreventCornerOverlap : 是否添加内边距,为了防止卡片内容和边角的重叠
contentPadding : 设置CardView边界跟内部的间距
contentPaddingLeft :设置CardView边界跟内部的左间距
contentPaddingRight:设置CardView边界跟内部的右间距
contentPaddingTop:设置CardView边界跟内部的上间距
contentPaddingBottom:设置CardView边界跟内部的下间距
-
一些问题和一些实现
- 在API21(5.0) 以上,使用起来没有问题,图片:
- 但是在API21以下,在CardView 与内部view会有默认的边距, 图 , 原因是因为 在API21以下,为了防止内容与CardView 重叠, 默认使用cardPreventCornerOverlap =true 使会有默认边距 ,解决这个问题, 只需要添加代码
cardPreventCornerOverlap =false
即可 - CardView设置不了与屏幕的间距, 只需要在CardView外面再套一层布局 再设置CardView的margin值即可.
- CardView继承于FrameLayout 可以作为根布局来使用, 具有FrameLayout的一切特点,但是要注意第三点提到的问题,同时也要注意子View的位置.
- 去除阴影
card_view:cardElevation="0dp"
即可 - 设置点击水波纹效果
android:foreground="?attr/selectableItemBackground"
但是在5.0以下就没有效果 - 实现Material Design 点击阴影效果 需要借助5.0的属性
android:stateListAnimator
, 5.0以下没有效果
创建一个Z轴方向的动画,设置属性为android:stateListAnimator="@anim/xxx
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true" android:state_pressed="true">
<objectAnimator
android:duration="@android:integer/config_shortAnimTime"
android:propertyName="translationZ"
android:valueTo="@dimen/touch_raise"
android:valueType="floatType" />
</item>
<item>
<objectAnimator
android:duration="@android:integer/config_shortAnimTime"
android:propertyName="translationZ"
android:valueTo="0dp"
android:valueType="floatType" />
</item>
</selector>