浮动操作按钮边框颜色未改变。

13

我使用以下代码更改了Floating Action Button的backgroundTintList颜色:

fab.setBackgroundTintList(ColorStateList.valueOf(mResources.getColor(R.color.fab_color)));

但是在API 4.4.2上,我最终得到了以下结果:

在此输入图片描述

在API 21及以下版本中,FAB存在问题,而在API 21及以上版本中,一切看起来都很好。

我是通过编程方式创建FAB的,代码如下:

    FloatingActionButton fab = new FloatingActionButton(this);
    CoordinatorLayout.LayoutParams layoutParams = new CoordinatorLayout.LayoutParams(
            ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
    fab.setLayoutParams(layoutParams);
    layoutParams.rightMargin = mResources.getDimensionPixelSize(R.dimen.activity_horizontal_margin);
    ((CoordinatorLayout) findViewById(R.id.coordinatorLayout)).addView(fab);

    CoordinatorLayout.LayoutParams p = (CoordinatorLayout.LayoutParams) fab.getLayoutParams();
    p.setAnchorId(R.id.appBarLayout);
    p.anchorGravity = Gravity.BOTTOM | Gravity.END;
    fab.setLayoutParams(p);
    fab.setVisibility(View.VISIBLE);
    fab.setBackgroundTintList(ColorStateList.valueOf(mResources.getColor(R.color.fab_color)));
    fab.setImageDrawable(getResources().getDrawable(R.drawable.ic_button));

我偶然看到了FloatingActionButton的官方源代码,发现他们在这里实例化了一个borderDrawable:

 @Override
void setBackgroundDrawable(Drawable originalBackground, ColorStateList backgroundTint,
        PorterDuff.Mode backgroundTintMode, int rippleColor, int borderWidth) {
    // Now we need to tint the original background with the tint
    mShapeDrawable = DrawableCompat.wrap(originalBackground.mutate());
    DrawableCompat.setTintList(mShapeDrawable, backgroundTint);
    if (backgroundTintMode != null) {
        DrawableCompat.setTintMode(mShapeDrawable, backgroundTintMode);
    }

    final Drawable rippleContent;
    if (borderWidth > 0) { // BORDER DRAWABLE RIGHT HERE!!
        mBorderDrawable = createBorderDrawable(borderWidth, backgroundTint);
        rippleContent = new LayerDrawable(new Drawable[]{mBorderDrawable, mShapeDrawable});
    } else {
        mBorderDrawable = null;
        rippleContent = mShapeDrawable;
    }

    mRippleDrawable = new RippleDrawable(ColorStateList.valueOf(rippleColor),
            rippleContent, null);

    mShadowViewDelegate.setBackgroundDrawable(mRippleDrawable);
    mShadowViewDelegate.setShadowPadding(0, 0, 0, 0);
}
5个回答

29

我最终添加了:

app:borderWidth="0dp"

这不会创建borderDrawable并且边框不可见。


6

只需在样式文件中更改coloraccent即可。

<item name="colorAccent">@color/colorAccent</item>

添加您所想要的颜色作为FAB的背景色

编辑:好的,那么这里有一个替代方法可以做到...在您的xml中定义此FAB。

  <android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    app:backgroundTint="@color/fab_color"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/ic_dialog_email" />

它将进行更改,因此您不需要以程序方式执行。


2
我在应用程序中有其他视图必须使用特定的颜色强调,因此这个选项不可行,而且不太具有可扩展性。这更像是一个“核心”选项,我宁愿不这样做。 - AndyRoid
1
这是没有建设性的。 - AndyRoid
@AndyRoid,请检查一下,我在答案中添加了另一个建议。 - curiousMind
2
这与问题无关。 - Carter Hudson

4

要仅更改背景颜色,请使用以下代码:app:backgroundTint="#4000FF00"

例如:

<android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="54dp"
        android:layout_marginRight="16dp"
        android:clickable="true"
        android:src="@drawable/ic_edit"
        app:layout_anchor="@id/xxxx"
        app:rippleColor="@android:color/white"
        app:backgroundTint="#00FF00"
        app:layout_anchorGravity="bottom|end|right"
        />

如果您想使它透明,请使用app:elevationapp:pressedTranslationZ属性。

例如:

<android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="54dp"
        android:layout_marginRight="16dp"
        android:clickable="true"
        android:src="@drawable/ic_edit"
        app:layout_anchor="@id/xxx"
        app:borderWidth="0dp"
        app:rippleColor="@android:color/white"
        app:backgroundTint="#4000FF00"
        app:elevation="0dp"
        app:pressedTranslationZ="0dp"
        app:layout_anchorGravity="bottom|end|right"
        />

这些属性用于在点击时给视图添加效果,并给按钮提高程度。


这适用于边框!在命名空间中,“android”和“app”的行为是不同的。 将其设置为app:backgroundTint会更改边框颜色。谢谢。 - My dream is unemployed

2

您可能需要以向后兼容的方式以编程方式更改颜色:

DrawableCompat.setTintList(DrawableCompat.wrap(fab.getDrawable()), tintColor); <- 图标

DrawableCompat.setTintList(DrawableCompat.wrap(fab.getBackground()), backgroundTintColor); <- 背景


2

我认为仍有些人会遇到这种情况,因此这可能对某些人有所帮助。

在属性部分,有两个backgroundTint属性,第二个是用于更改边框颜色的。

我认为这很有帮助,希望能帮到某些人。enter image description here


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接