Shaped drawable with selectableItemBackground as background

Question

I have couple buttons that I need an oval shaped border.

So i have this in a capsule_border.xml

<?xml version="1.0" encoding="UTF-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android">     <corners android:radius="9999dp"/>     <stroke         android:width="1px"         android:color="@color/border_gray" /> </shape> 

And I would use android:background="@drawable/capsule_border.xml where I need it.

Now, I would like to have a button to have this oval shaped border, but also a android:background="?selectableItemBackground" for the visual feedback.

I tried to use a parent layout with the selectableItembackground and button with capsule_border. But it seems that the clickable area that gets highlighted is the whole square. Instead of only the area within the capsule border.

Is there someway that I can make it so that the selectableItemBackground does not highly the whole rectangle of the view, but only within the border that i draw?

Answer 1

Having round_corners.xml:

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"        android:shape="rectangle">     <solid android:color="@android:color/transparent"/>     <corners android:radius="15dp" />     <stroke         android:width="1px"         android:color="#000000" /> </shape> 

And my_ripple.xml:

<?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android="http://schemas.android.com/apk/res/android"         android:color="?android:attr/colorControlHighlight">     <item android:id="@android:id/mask">         <shape android:shape="rectangle">             <solid android:color="#000000" />             <corners android:radius="15dp" />         </shape>     </item>     <item android:drawable="@drawable/round_corners" /> </ripple> 

And button:

<Button     android:background="@drawable/my_ripple"     ... /> 

Will result in this:

See this article.