I would like to achieve a ripple effect when someone presses my ImageView, but also have different drawables for other states.
I have a very simple ImageView
:
<ImageView
android:id="@+id/image"
android:layout_width="120dp"
android:layout_height="120dp"
android:clickable="true"
/>
I add my background to it:
mImage.setBackgroundResource(R.drawable.background_resource);
My drawable looks like this:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="false">
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="@android:color/darker_gray"/>
<size
android:width="80dp"
android:height="80dp"/>
</shape>
</item>
<item android:state_selected="true" android:state_pressed="false">
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="@android:color/holo_blue_bright"/>
<size
android:width="120dp"
android:height="120dp"/>
</shape>
</item>
<item android:state_pressed="true">
<ripple android:color="@android:color/holo_blue_dark">
<item android:id="@android:id/mask">
<shape android:shape="oval">
<solid android:color="@android:color/holo_blue_dark"/>
<size
android:width="120dp"
android:height="120dp"/>
</shape>
</item>
</ripple>
</item>
</selector>
When I click, the background disappears instead of showing the ripple effect. The other states work fine. Any idea what I am doing wrong here?
The animation of ripples can be disabled by using the animation global option. If the enterDuration and exitDuration is being set to 0 , ripples will just appear without any animation.
Ripple touch effect was introduced with material design in Android 5.0 (API level 21). Touch feedback in material design provides an instantaneous visual confirmation at the point of contact when users interact fwith UI elements.
It turns out you've got it the other way, in order for the ripple to show up, you need to include the selector inside the ripple drawable
i.e., the xml should be looking like
<ripple android:color="@color/ripple_color">
<item android:id="@android:id/mask">
<!-- ripple mask goes here -->
</item>
<item>
<selector>
<!-- your selector goes here -->
</selector>
</item>
</ripple>
HTH.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With