如何使用第三方達成Ripple的效果

情境

在android5.0以後 View會多出一種水波式的特效稱為Ripple
如果想要有Ripple的效果 可以利用好用的第三方

程式碼說明

首先將Ripple的第三方加入到Gradle

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

先來試看看一般的效果,
首先宣告一個TextView

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="com.example.givemepass.rippledemo.MainActivity">

    <TextView
        android:text="Hello World!"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</RelativeLayout>

點擊這個TextView, 毫無反應就只是個TextView。


接著我們試著透過第三方來包覆它。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.givemepass.rippledemo.MainActivity">
    <com.balysv.materialripple.MaterialRippleLayout
        android:layout_weight="0.5"
        app:mrl_rippleColor="@android:color/darker_gray"
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:gravity="center"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:text="Hello World!" />
    </com.balysv.materialripple.MaterialRippleLayout>
</RelativeLayout>

有囉! 出現Ripple效果, 而且在android 5.0以下仍然有這樣的效果
如此一來就可以透過這樣的方式來完成我們的特效。

GitHub