FAB color change with ripple effect

Question

in Android, I want to do something similar (but with two alternating colors, black and white:

color change with ripple effect like this

What I tried to do:

1) set default backgroundTint and ripple color via XML

app:backgroundTint="@android:color/black"
app:rippleColor="@android:color/white"

2) in the onclick method, changed backgroundTint to white and ripple color to black

set the line for the initial color, i.e. high_color = "black". then

fab.setOnClickListener(new View.OnClickListener() {
        @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
        @Override
        public void onClick(View v) {
            if(high_color.equals("black")){
                fab.setBackgroundTintList(ColorStateList.valueOf(ContextCompat.getColor(getApplicationContext(), R.color.white)));
                fab.setImageTintList(ColorStateList.valueOf(ContextCompat.getColor(getApplicationContext(), R.color.black)));
                fab.setRippleColor(ContextCompat.getColor(getApplicationContext(), R.color.black));
                high_color = "white";
            }else {
                fab.setBackgroundTintList(ColorStateList.valueOf(ContextCompat.getColor(getApplicationContext(), R.color.black)));
                fab.setImageTintList(ColorStateList.valueOf(ContextCompat.getColor(getApplicationContext(), R.color.white)));
                fab.setRippleColor(ContextCompat.getColor(getApplicationContext(), R.color.whites));
                high_color = "black";
            }
        }
    });

now i get something like this:

what i get is

Anyway, to make it look like the first? for example, by slowing down the speed of the ripple animation or something like that?

Answer 1

, .

.

<selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:color="@android:color/white" state_enabled="true "/> <item android:color="@android:color/black" state_enabled="false "/> </selector>

FAB

app:background ="@drawable/selector"

, . android. Android- , .

Answer 2

, FAB, ImageButton , , . , . API, s 21 (Lollipop). ImageButton 6dp, 18dp (6dp + 12dp), , lift_on_touch.xml. , StateListAnimator, ImageButton.

<ImageButton
    android:id="@+id/share_fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="16dp"
    android:background="@drawable/ripples_on_touch"
    android:elevation="6dp"
    android:padding="16dp"
    android:src="@drawable/ic_share_white_24dp"
    android:stateListAnimator="@animator/lift_on_touch"
    tools:targetApi="lollipop" />

V21/ripples_on_touch.xml

<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:color="#F83E0ACC"
tools:targetApi="lollipop">
<item>
    <shape android:shape="oval">
        <solid android:color="#FFFF6F00" />
    </shape>
</item>
</ripple>

V21/lift_on_touch.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
    <set>
        <objectAnimator
            android:duration="@android:integer/config_longAnimTime"
            android:propertyName="scaleX"
            android:valueTo="1.250"
            android:valueType="floatType" />
        <objectAnimator
            android:duration="@android:integer/config_longAnimTime"
            android:propertyName="scaleY"
            android:valueTo="1.250"
            android:valueType="floatType" />
        <objectAnimator
            android:duration="@android:integer/config_longAnimTime"
            android:propertyName="translationZ"
            android:valueTo="12dp"
            android:valueType="floatType" />
    </set>
</item>

<item>
    <set>
        <objectAnimator
            android:duration="@android:integer/config_longAnimTime"
            android:propertyName="scaleX"
            android:valueTo="1.0"
            android:valueType="floatType" />
        <objectAnimator
            android:duration="@android:integer/config_longAnimTime"
            android:propertyName="scaleY"
            android:valueTo="1.0"
            android:valueType="floatType" />
        <objectAnimator
            android:duration="@android:integer/config_longAnimTime"
            android:propertyName="translationZ"
            android:valueTo="0dp"
            android:valueType="floatType" />
    </set>
</item>
</selector>