使用涟漪效果更改FAB颜色

时间:2017-01-26 10:55:37

标签: android android-layout floating-action-button rippledrawable

在Android中,我想做类似的事情(但是有两种交替的颜色黑白:

像这样用涟漪效果改变颜色

enter image description here

我试图做的是:

1)设置默认backgroundTint&通过XML涟漪颜色

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

2)在onclick方法中,将backgroundTint更改为白色并将波纹颜色更改为黑色

设置初始颜色的字符串,即high_color = "black"。那么,

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";
            }
        }
    });

现在我得到这样的东西:

我得到的是这个

enter image description here

无论如何要让这个看起来像第一个?比如减慢涟漪动画的速度或类似的东西?

2 个答案:

答案 0 :(得分:1)

好吧,从来没有在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>

答案 1 :(得分:0)

我认为你应该使用选择器 选择器可以轻松地在后台进行更改。

以类似的方式使用选择器

"bob"

使用它作为FAB的背景

<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>

当它被拍摄时,这将使白色作为背景。它将是黑色的 选择器中有更多的Android代码。阅读关于Android开发者网站上的选择器 如果这真的帮助了你,请回复我。