Button ripple effect spread to cover only alpha image OR avoid covering transparent spots

Question

What I have read previously

1. Add ripple effect to my button with button background color?
2. Android ripple for button not working
3. Ripples on a shape with a transparent background
4. Transparent background in ImageButton with ripple effect?
5. RippleDrawable - dev

What I need is to make custom ripple effect cover only alpha channel of my image OR avoid covering transparent spots.

My original botton

            <Button
                android:layout_width="96dp"
                android:layout_height="96dp"
                android:layout_gravity="center"
                android:background="@drawable/btn_round"
                android:foreground="@drawable/btn_ripple"/>

What I have tried from suggested with button android:background="?attr/selectableItemBackgroundBorderless‌​" android:foreground="?attr/selectableItemBackgroundBorderless‌​". It did not quite work. In fact it ignores borders of my image and shape set in ripple whilst I need to constrain ripple spread shape to alpha channel.

As you already can see I have 3 options to combine

1. custom button shape
2. custom ripple
3. cutting-off alpha channel from suggested options

So I tried transforming button into imageButton

           <ImageButton
                android:layout_width="96dp"
                android:layout_height="96dp"
                android:layout_gravity="center"
                android:background="@drawable/btn_round"
                android:foreground="@drawable/btn_ripple"
                android:scaleType="fitXY"/>

However I have tried all combinations of src, background and foreground for all 3 and did not succeed. Also tried adding android:background="?attr/selectableItemBackgroundBorderless‌​" android:foreground="?attr/selectableItemBackgroundBorderless‌​" to ripple. That doesn't work either.

Reference this picture (that one does not have alpha but that is not the case)

Answer 1

Solution was plain to see:

in ripple.xml

<item
    android:id="@android:id/mask"
    android:drawable="@drawable/btn_enable" />

without < shape > inside

Answer 2

Add a mask to the ripple effect. Only the alpha channel of the mask is used so it can be the same as your background image.

var rippleColorLst = android.content.res.ColorStateList.valueOf(
    android.graphics.Color.argb(255,50,150,255)
);
var ripple = new android.graphics.drawable.RippleDrawable(
    rippleColorLst,
    yourImageDrawableWithAlpha,
    yourImageDrawableWithAlpha   // the 3rd parameter is mask
); 
yourButtor.setBackground(ripple);

(Sorry for the JavaScript/NativeScript code, hope everyone can understand it.)