Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why does the ripple effect remove my original background?

So I'm trying to create a ripple effect with a cusotm color, and kind of succeeds, except the ripple effect removes the original background and thus creates a semi-transparent ripple effect which is not what I want.

Layout:

    <Button
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:text="Clicky"
        android:colorControlHighlight="@android:color/holo_blue_light"
        android:background="@drawable/selector">
    </Button>

drawable/selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@drawable/ripple"/>
    <item android:drawable="@color/normal"/>
</selector>

drawable/ripple.xml:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="#7f7">
</ripple>

color.xml

<resources>
    <color name="normal">#070</color>
</resources>

What do I have to do to keep the green (#070) background while the ripple effect is overlayed? I believe that's the intention, right?

Edit

I have now introduced a shape as suggested by AcademicDuck:

drawable/red_shape.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="rectangle">
    <solid android:color="@color/normal" />
</shape>

This shape is referenced by the now modified ripple:

drawable/ripple.xml:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:drawaleb="@drawable/red_shape">
</ripple>

What changes now is that when I press the background is a solid red color instead of transparent. Still no ripple though.

like image 892
Nilzor Avatar asked Nov 13 '14 12:11

Nilzor


1 Answers

In order to use your custom drawable, you need to specify it in the ripple drawable like this (RippleDrawable):

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/yourRippleColor">
    <item android:drawable="@drawable/yourDrawable" />
</ripple>

Also, it worth to check the following questions too: Android L's Ripple Effect - Touch Feedback for Buttons - Using XML and android ripple button with background

like image 78
GregoryK Avatar answered Sep 19 '22 21:09

GregoryK