Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Ripple: How do other apps make their ripple so transparent without affecting the original colour of the view

When you look at other apps like yPlan or Google Play Store, their ripple effect on buttons is like a light grey or black that does not change the colour of the whole button.

I want this same effect.

Here is what i tried but its not the same

This is my colour control highlight: Its a grey with 99% alpha

    <color name="colorHighlight">#fc8c969f</color>

And this is my ripple drawer for my button

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?android:colorControlHighlight">
    <item android:id="@android:id/mask" android:drawable="@android:color/white"/>
    <item android:drawable="@color/colorAccentWith92PercentOpacity"/>
</ripple>

Note the drawable is to make the colour of the button yellow since i cant use android:background twice

like image 698
Ersen Osman Avatar asked Dec 24 '22 14:12

Ersen Osman


1 Answers

<?xml version="1.0" encoding="utf-8"?>
<!--Use an almost transparent color for the ripple itself-->
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="#22000000"> 

    <!--Use this to define the shape of the ripple effect (rectangle, oval, ring or line). The color specified here isn't used anyway-->
    <item android:id="@android:id/mask">
        <shape android:shape="rectangle">
            <solid android:color="#000000" /> 
        </shape>
    </item>

    <!--This is the background for your button-->
    <item>
        <!--Use the shape you want here-->
        <shape android:shape="rectangle">
            <!--Use the solid tag to define the background color you want (here yellow)-->
            <solid android:color="#ffff00"/> 
            <!--Use the stroke tag for a border-->
            <stroke android:width="1dp" android:color="#ffff00"/>
        </shape>
    </item>
</ripple>
like image 171
Fe Le Avatar answered Jan 04 '23 23:01

Fe Le