Android5.0水波紋效果适配4.X

最近研究Google Material Design 發現檔次比公司UI圖高很多,有木有.這裡先實作個水波紋效果來感受下 效果圖:

1. 系統有界效果

.xml設定:

向下相容,API21以下也可以使用,點選會變色,但不會有水波紋效果.

2. 系統無界效果

.xml設定:

特别注意: 此效果API21以上才能用,21以下會報錯. 是以最小版本要設定為21

3. 自定義有界效果

在res裡建立drawable-v21檔案 white_ripple.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="@color/ripple">
   <!--去掉此item内容就是無界效果-->
    <item>
        <shape>
            <!-- 中間的背景色-->
            <solid android:color="@color/white"/>
        </shape>
    </item>

</ripple>
           

特别注意: 需要在drawable檔案裡建立同名檔案white_ripple.xml 适配5.0以下機型.不然會崩潰的

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 沒有焦點時的背景顔色 -->
    <item android:drawable="@color/white" android:state_window_focused="false" />
    <!-- 非觸摸模式下獲得焦點并單擊時的背景顔色 -->
    <item android:drawable="@color/ripple" android:state_focused="true" android:state_pressed="true" />
    <!-- 觸摸模式下單擊時的背景顔色 -->
    <item android:drawable="@color/ripple" android:state_focused="false" android:state_pressed="true" />
    <!-- 選中時的背景顔色 -->
    <item android:drawable="@color/ripple" android:state_selected="true" />
    <!-- 獲得焦點時的背景  顔色 -->
    <item android:drawable="@color/ripple" android:state_focused="true" />
</selector>
           

另:5.0以下沒有水波紋效果.就是點選變色效果

4.自定義selector圓角效果

在res裡建立drawable-v21檔案 button_ripple.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="@color/colorAccent">
    <item>
        <shape>
            <!-- 中間的背景色 -->
            <solid android:color="@color/colorPrimaryDark"/>
            <!-- 設定四個角的角度 -->
            <corners android:radius="4dp"/>
        </shape>
    </item>

</ripple>
           

同樣需要在drawable檔案裡建立同名檔案button_ripple.xml 适配5.0以下機型.

參考資料:http://blog.csdn.net/u012702547/article/details/52325418

就這樣吧 有興趣的可以去看看 還有圖形的點選變換效果

DEMO下載下傳位址