关于CardView要注意的细节

原文出处：http://blog.feng.moe/2015/10/24/something-about-cardview-development/

• 注意不同 SDK 版本（低于 Lollipop 21）上的边距（Margin）效果

        Google在Android Lollipop 中引入了Material Design设计中的阴影（Elevation）和Z轴位移，其目的就是突出界面中不同元素之间的层次关系。为了统一不同系统版本的视觉效果，Google 针对 SDK 21 以下的系统给 CardView 加入一个 Elevation 兼容（即 XML 中的 app:cardElevation 和 Java 代码中的 setCardElevation）。然而，在低版本中设置了 CardElevation 之后 CardView 会自动留出空间供阴影显示，而 Lollipop 之后则需要手动设置 Margin 边距来预留空间。
        因此，我们需要自定义一个 dimen 作为 CardView 的 Margin 值：

1. 创建 /res/value 和 /res/value-v21 资源文件夹于项目对应 Module 目录下，前者放置旧版本/通用的资源文件（了解的可以跳过），后者放置 21 及更高 SDK 版本的资源文件。
2. 在 value 内的 dimen.xml 创建一个 Dimension （<dimen> 属性），随便命个名（如 xxx_card_margin）并填入数值 0dp。
3. 接着在 value-v21 文件夹内的 dimen.xml 创建名字相同的 Dimension，并填入你期望的预留边距（一般和 CardElevation 阴影大小相同）
4. 最后，在你布局中的 CardView 中设置 android:layout_margin="@dimen/xxx_card_margin"

这样依赖就解决了低版本中边距过大或者视觉效果不统一的问题了

•  为你的 Card 添加点击效果

           当使用 CardView 的场合是作为列表中的一个 Item 且直接单击 Item 有相应的操作，那么就有必要加上视觉反馈来告诉用       户这个 Card 是可点击的。

           如果你是用了 AppCompat v7 支持库：
  那么你可以直接给 CardView 加   上 android:foreground="?attr/selectableItemBackground" 这个属性会在 Lollipop 上自动加上 Ripple 效果，在旧版本则是一个







• 让点击效果更加贴近 Material Design
  

         上面曾提到过一个概念：Z 轴位移，即决定元素层次的深度，与 Elevation 大小相加构成实际显示的阴影深度。
在 Material Design Guidelines 中有建议卡片、按钮这类元素触摸时应当有一个浮起的效果，也就是增大 Z 轴位移

         

要实现这个效果并不难，我们只需要借助 Lollipop 的一个新属性 android:stateListAnimator （PS：这也意味着这个方法不可以用于旧版本系统QAQ）

首先，创建一个 TranslationZ 的变换动画放在 /res/anim，自己取一个名（如 touch_raise.xml），加入以下内容：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<?xmlversion="1.0"encoding="utf-8"?>

<selectorxmlns:android="http://schemas.android.com/apk/res/android">

     <itemandroid: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>

然后为你需要添加效果的 CardView（其他 View 同理）所在的 Layout XML 复制多一份到 /res/layout-v21，然后在新的那份 XML 的 CardView 中加入属性 android:stateListAnimator="@anim/touch_raise"。
这样，你的卡片按住时就会有浮起（阴影加深）的效果了。

◆ 尽量不要用作固定高度的 List Item

除了横向滚动列表和类似 Google Play 音乐中的带封面图片卡片 Item，其他地方应该尽量避免做固定高度的卡片。