androidrippledrawable

Ripples on a shape with a transparent background


I am using the following shape in my app

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape android:shape="oval" >
            <solid android:color="@color/primary_light"/>
            <size android:height="80dp" android:width="80dp"/>
        </shape>
    </item>

    <item android:state_focused="true">
        <shape android:shape="oval">
            <stroke android:color="@color/primary_light" android:width="5dp"/>
            <size android:height="80dp" android:width="80dp"/>
        </shape>
    </item>

    <item>
        <shape android:shape="oval">
            <solid android:color="@android:color/transparent"/>
            <size android:height="80dp" android:width="80dp"/>
        </shape>
    </item>
</selector>

It is there in my drawable folder. Now I am updating my app to Lollipop and I wish to give a ripple feedback on the circular button that I used. So in drawable-v21 folder I changed it to a ripple selector:

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="@color/primary_light">
    <item>
        <selector>
            <item android:state_focused="true">
                <shape android:shape="oval">
                    <stroke android:color="@color/primary_light" android:width="5dp"/>
                    <size android:height="80dp" android:width="80dp"/>
                </shape>
            </item>

            <item android:id="@android:id/mask">
                <shape android:shape="oval">
                    <solid android:color="@android:color/transparent"/>
                    <size android:height="80dp" android:width="80dp"/>
                </shape>
            </item>
        </selector>
    </item>
</ripple>

But unfortunately the ripple effect is not generated by using the above drawable in Lollipop. Is it because of the <solid android:color="@android:color/transparent"/>?

Can anyone show me where I have go wrong? Thanks


Solution

  • After a few trial and errors it seems I have misunderstood the hierarchy of the selector and item.

    The following works perfectly.

    <ripple xmlns:android="http://schemas.android.com/apk/res/android"
            android:color="@color/primary_light">
            <item android:id="@android:id/mask">
                   <shape android:shape="oval">
                           <solid android:color="@android:color/white"/>
                           <size android:height="80dp" android:width="80dp"/>
                   </shape>
            </item>
    </ripple>