Android Material Design Ripple Effect tutorial
In this tutorial I am going to talk about Android Material Design Ripple Effect tutorial . Ripple effect only show on device running lollipop and above. you can add ripple effect or animation in your android, layouts, buttons, textviews, etc. and you can also change its color.Ripple Effect may be of different types like circular, rectangle etc.RippleDrawable class that shows a ripple effect in response to state changes. There are more than one way to do it. Let’s see how to do ripple effect in Android.
Prerequisites:
- JDK 7.0 or Above
- Android Studio 2.0
Steps to Follow:
Step 1: Create a New Android Studio project name Ripple1.
Step 2: Select minimum API level 21 as Ripple Effect or Animation works on and Above the Lolipop version.
Step 3: Select Blank Activity and Give your layout xml name is activity_main and click finish.
Inside Drawable folder write the following code. A touch feedback drawable may contain multiple child layers, including a special mask layer that is not drawn to the screen. A single layer may be set as the mask from XML by specifying its android:id value as mask.
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#0198E1"
tools:targetApi="lollipop">
<item android:id="@android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#0198E1"/>
</shape>
</item>
</ripple>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#0198E1"
tools:targetApi="lollipop">
<item android:id="@android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#0198E1"/>
</shape>
</item>
</ripple>
Step 4: Inside activity_main.xml write the following code.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="Click to see ripple effect" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ripple"
android:padding="16dp"
android:text="Click Here" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:background="@drawable/ripple"
android:padding="16dp"
android:text="Click here"/>
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="Click to see ripple effect" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/ripple"
android:padding="16dp"
android:text="Click Here" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:background="@drawable/ripple"
android:padding="16dp"
android:text="Click here"/>
</LinearLayout>
Now compile and test the application in real device.

Comments ( 2 )

kuldip kotadiya:
Thanks for riple effect ..
Thanks for riple effect ..

suman mondal 8348006187:
please sir make a tutorial on json parsing to communicate between a php script and android app
please sir make a tutorial on json parsing to communicate between a php script and android app
Subscribe Latest Information
Categories
Most Popular Posts
How to Withdraw Money from ATM Machine 7steps 1178782 Views
How to Create Chat Application in Android Studio 151635 Views
How to Create a Shopping Cart Application in Android 114497 Views