Android Water Ripple Click Effect (Ripple Effect)

Android released the preview version of Android m last week. But presumably Android5.0 a lot of cool effects, most developers have not used, that is not to say the majority of users.

This article describes one of the cool effects in Android5.0, click on the Water Ripple Diffusion effect (Ripple Effect).

The implementation described below is a new API that calls Android5.0, not a custom implementation, so it supports devices in Android5.0.

If you want to be compatible with a low-system version, you need to create a new v21 (i.e. Android5.0) resource Directory.

Water ripple effect on rounded background (e.g.)

1. Define an XML with a normal rounded background;

Rounded_corners.xml

<?XML version= "1.0" encoding= "Utf-8"?><Shapexmlns:android= "Http://schemas.android.com/apk/res/android"Android:shape= "Rectangle">    <SolidAndroid:color= "#FFFFFF" />    <CornersAndroid:radius= "4DP" /></Shape>

2. Here is the key,<ripple> is API21 only the new tag, is to achieve the effect of water ripple;

where <ripple android:color= "#FF21272B" .../> This is the color of the specified water ripple.

and <item/> Inside of things, we are very familiar with, is the ordinary definition of a rounded corner of the background.

Ripple_bg.xml:

<?XML version= "1.0" encoding= "Utf-8"?><Ripplexmlns:android= "Http://schemas.android.com/apk/res/android"Android:color= "#FF21272B">    <Item>        <ShapeAndroid:shape= "Rectangle">            <SolidAndroid:color= "#FFFFFF" />            <CornersAndroid:radius= "4DP" />        </Shape>    </Item>    <Itemandroid:drawable= "@drawable/rounded_corners" /></Ripple>

3. This is the layout XML of the activity;

Activity_main.xml

<LinearLayoutxmlns: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:gravity= "Center"android:orientation= "vertical"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=". Mainactivity ">    <TextViewAndroid:layout_width= "Wrap_content"Android:layout_height= "Wrap_content"Android:text= "@string/hello_world" />    <ButtonAndroid:layout_width= "Match_parent"Android:layout_height= "Wrap_content"Android:background= "@drawable/ripple_bg"Android:text= "@string/hello_world" /></LinearLayout>

Android Water Ripple Click Effect (Ripple Effect)