android 控制元件點選水波紋效果的幾種方案

weixin_33782386發表於2017-07-07

目前我所知道的至少有三種可以實現點選水波紋的效果

第一種:安卓自帶的方法

在安卓中有自帶的一種屬性,可以實現水波紋的效果,就是在所需要點選的控制元件屬性加上如下程式碼:

android:background="?attr/selectableItemBackground"

這種水波紋效果只適用於5.0以後的安卓系統

第二種:編寫ripple檔案

在res檔案先建立drawable-v21資料夾,並在資料夾下建立ripple檔案,命名符合安卓命名規範就行了,如下圖,我命名為bg_white:

2421264-68e7b3a2f4821355.png
Paste_Image.png

接下來我們看看ripple檔案該怎麼寫,其實就是寫個shape,給個顏色值,如下圖:

2421264-994c5f4799f30fe4.png
Paste_Image.png

在xml檔案中呼叫控制元件的background屬性:

android:background="@drawable/bg_white"

如下圖:

2421264-3abdd4135360ff43.png
Paste_Image.png

需要注意的是,需要在drawable資料夾下建立同名的bg_white.xml檔案,可以是selector或者shape檔案,這個是為了兼顧5.0以下的版本的點選效果,如果沒有的話,在5.0以下的版本在點選時候會報錯

這一種也是隻能在5.0以後系統才有效

第三種:github別人寫的控制元件

github地址:https://github.com/balysv/material-ripple
使用步驟:

1.新增依賴:

compile 'com.balysv:material-ripple:1.0.2'

2.包裹你要點選的佈局

<com.balysv.materialripple.MaterialRippleLayout
android:id="@+id/ripple"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<Button
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:text="Button inside a ripple"/>
</com.balysv.materialripple.MaterialRippleLayout>

其中提供瞭如下屬性,可以設定你水波紋時間,水波紋顏色,等等效果

2421264-3784b0293d3cff21.png
Paste_Image.png

值得一說的是這種方式適配範圍較管,可以適配到4.0以上的(4.0一下沒測試過),就是在寫佈局時候都要巢狀一層,會比較繁瑣。

以上就是我所知道的三種方式新增水波紋的效果,其實github上面也有好幾個新增水波紋效果的,但是都跟第三種大同小異,都是包裹布局的。就不一一列舉了。

相關文章