Keep ripple within stroke

Question

I'm trying to create a ripple background drawable for a Button with a stroke.

This is what I have so far:

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#336699">

    <item>
        <shape android:shape="rectangle">

            <solid android:color="#998811" />

            <stroke
                android:width="2dp"
                android:color="#119988" />

        </shape>
    </item>
</ripple>

But with this solution, the ripple overlaps with my stroke.
I only want the ripple within the stroke, How can I do this?

Answer 1

As per the documentation you add another item with id @android:id/mask - that will limit where the ripple goes. You can set that to be inset, like so:

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#336699">

    <item>
        <shape android:shape="rectangle">

            <solid android:color="#998811" />

            <stroke
                android:width="2dp"
                android:color="#119988" />

        </shape>
    </item>

    <item android:id="@android:id/mask">
        <inset android:insetBottom="2dp"
               android:insetLeft="2dp" 
               android:insetRight="2dp"
               android:insetTop="2dp">
            <shape android:shape="rectangle">
                <!-- Color doesn't matter -->
                <solid android:color="@android:color/white"/>
            </shape>
        </inset>
    </item>
</ripple>