Android面试题-CardView 设置水波纹效果

2017-06-06 本文已影响3351人小怪兽打葫芦娃

Android程序员面试宝典

自定义控件

联网

工具

数据库

源码分析相关面试题

Activity相关面试题

Service相关面试题

与XMPP相关面试题

与性能优化相关面试题

与登录相关面试题

与开发相关面试题

与人事相关面试题

人事面试宝典

设置CardView水波纹效果

<android.support.v7.widget.CardView
    android:id="@+id/news_list_card_view"
    style="@style/cardStyle"
    android:background="@drawable/item_selector"
    android:clickable="true"
    android:focusable="true"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    card_view:cardCornerRadius="4dp"
    card_view:cardElevation="4dp">

  
</android.support.v7.widget.CardView>

cardview设置了背景选择器，代码如下：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/text_Grey" android:state_pressed="true"/>
    <item android:drawable="@color/text_Grey" android:state_focused="true"/>
    <item android:drawable="@color/colorWhite"/>
</selector>

发现并没有效果，解决方案如下，给CardView添加个前景：

android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"

这样就可以了，在5.0以上的设备上有点击有波纹效果，5.0以下无波纹，只有前景色变化

自定义CardView前景

分为5.0之前和之后两种设置，因为5.0之前没有ripple，所以5.0之前采用inset 代替。
设置CardView自定义的前景：

android:foreground="@drawable/card_foreground"

5.0之后

drawable-v21/card_foreground.xml

<ripple xmlns:android="http://schemas.android.com/apk/res/android" 
android:color="#20000000"
android:drawable="@drawable/card_foreground_selector" />

drawable-v21/card_foreground_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <solid android:color="#18ffc400"/>
        </shape>
    </item>
    <item android:state_focused="true" android:state_enabled="true">
        <shape android:shape="rectangle">
            <solid android:color="#0f000000"/>
        </shape>
    </item>
</selector>

效果：

5.0之前
drawable/card_foreground.xml

<inset xmlns:android="http://schemas.android.com/apk/res/android" 
    android:drawable="@drawable/card_foreground_selector"
    android:insetLeft="2dp"
    android:insetRight="2dp"
    android:insetTop="4dp"
    android:insetBottom="4dp"/>

drawable/card_foreground_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="rectangle">
            <solid android:color="#1838f508"/>
            <corners android:radius="@dimen/card_radius" />
        </shape>
    </item>
    <item android:state_focused="true" android:state_enabled="true">
        <shape android:shape="rectangle">
            <solid android:color="#0f000000"/>
            <corners android:radius="@dimen/card_radius" />
        </shape>
    </item>
</selector>

效果：

直接设置selector也是可以的：

android:foreground="@drawable/card_foreground_selector"