Ripple effect on shape drawable
More simple solution - to use this drawable-xml as value of property "android:background" of the Button:
drawable/bkg_ripple.xml:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?attr/colorControlHighlight">
<item android:drawable="?attr/colorPrimary"/>
<item android:id="@android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#000000" />
</shape>
</item>
</ripple>
button.xml:
<Button
android:id="@+id/mybutton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
...
android:background="@drawable/bkg_ripple"
/>
My advice would be not to use <ripple
tag. I have 2 reasons: it is not that easy to do exactly what you want and you have to 2 different .xml
files for every background. I don't like to have drawable-v21
folder.
My solution is to wrap your Button
with FrameLayout
and use android:foreground
attribute. This way you can have whatever background you want and you can keep the ripple effect.
<FrameLayout
android:id="@+id/login_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:foreground="?attr/selectableItemBackground">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/background_button"/>
</FrameLayout>
Notice that I moved all the attributes and the id to FrameLayout
. You should set onClickListener
to FrameLayout
instead of the Button
.
Btw, ?attr/selectableItemBackground
is great. Use it as much as possible. It replaces blue Holo color with gray for old devices from Android 4.0 to 4.3.
Try this.
ripple_effect.xml
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#2797e0"
tools:targetApi="lollipop">
<item android:id="@android:id/mask">
<shape android:shape="rectangle">
<solid android:color="#2797e0" />
</shape>
</item>
button.xml
<Button
android:id="@+id/login_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:background="@drawable/ripple_effect"/>
build.gradle
compile 'com.android.support:appcompat-v7:23.1.1'