ChatGPT解决这个技术问题 Extra ChatGPT

Android 更改浮动操作按钮颜色

我一直在尝试更改 Material 的 Floating Action Button 颜色,但没有成功。

<android.support.design.widget.FloatingActionButton
    android:id="@+id/profile_edit_fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:layout_margin="16dp"
    android:clickable="true"
    android:src="@drawable/ic_mode_edit_white_24dp" />

我试图添加:

android:background="@color/mycolor"

或通过代码:

FloatingActionButton fab = (FloatingActionButton) rootView.findViewById(R.id.profile_edit_fab);
fab.setBackgroundColor(Color.parseColor("#mycolor"));

或者

fab.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#mycolor")));

但以上都没有奏效。我也尝试了提出的重复问题中的解决方案,但它们都不起作用;按钮保持绿色,也变成了一个正方形。

PS如果知道如何添加涟漪效果也很好,也无法理解。

涟漪效果在棒棒糖之前的设备上不可用,因为它使用了新的 RenderThread
@karaokyo 好的,但我是怎么做的?
在我看来,谷歌在让这些东西可以访问方面做得很糟糕
要以编程方式执行此操作并向后兼容,请参阅 stackoverflow.com/questions/30966222/…

M
Marko

documentation 中所述,默认情况下,它采用 styles.xml 属性 colorAccent 中设置的颜色。

此视图的背景颜色默认为主题的 colorAccent。如果您希望在运行时更改此设置,则可以通过 setBackgroundTintList(ColorStateList) 进行。

如果你想改变颜色

在具有属性 app:backgroundTint 的 XML 中

<android.support.design.widget.FloatingActionButton
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    app:backgroundTint="@color/orange"
    app:borderWidth="0dp"
    app:elevation="6dp"
    app:fabSize="normal" >

在带有 .setBackgroundTintList 的代码中(下面由 ywwynm 回答)

正如评论中提到的@Dantalian,如果您希望将设计支持库的图标颜色更改为 v22(含),您可以使用

android:tint="@color/white"     

对于 v23 以来的设计支持库,您可以使用:

app:tint="@color/white"   

此外,对于 androidX 库,您需要在 xml 布局中设置 0dp 边框:

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_add"
    app:backgroundTint="@color/orange"
    app:borderWidth="0dp"
    app:elevation="6dp"
    app:fabSize="normal" />

这在 < API 12 设备的设计支持库 v23 中不起作用。它在 v22 中工作,所以他们显然破坏了一些东西。
请注意,如果您还想将图像颜色更改为白色,例如,您可以使用:android:tint="@android:color/white"
android:tint="@color/white" 对我不起作用,因为由于某种原因它无法解决。 android:tint="#ffffff" 虽然对我有用
那是因为您的 colors.xml 中不存在 @color/white。使用 @android:color/white 或创建一个名为 white 或任何你需要的颜色
使用“app:backgroundTint”而不是“android:backgroundTint”
C
Community

Vijet Badigannavar 的回答是正确的,但使用 ColorStateList 通常很复杂,他没有告诉我们如何去做。由于我们经常关注在正常和按下状态下更改 View 的颜色,因此我将添加更多细节:

如果要在正常状态下更改 FAB 的颜色,只需编写 mFab.setBackgroundTintList(ColorStateList.valueOf(your color in int));如果你想改变 FAB 在按下状态下的颜色,感谢 Design Support Library 22.2.1,你可以写 mFab.setRippleColor(your color in int);通过设置此属性,当您长按 FAB 时,您的触摸点会出现带有您颜色的波纹,并显示在 FAB 的整个表面上。请注意,在正常状态下它不会改变 FAB 的颜色。在 API 21(Lollipop)以下,没有涟漪效应,但是当你按下它时,FAB 的颜色仍然会改变。

最后,如果你想为状态实现更复杂的效果,那么你应该深入挖掘 ColorStateList,这里有一个 SO question 讨论它:How do I create ColorStateList programmatically?

更新:感谢@Kaitlyn 的评论。要使用 backgroundTint 作为其颜色来删除 FAB 的笔划,您可以在您的 xml 中设置 app:borderWidth="0dp"


谢谢你,我不知道如何使用 ColorStateList。但是,您的代码在我的 FAB 中留下了主题强调色的笔触(轮廓)。你知道我怎样才能去掉那个笔触(或者改变它的颜色),并有一个特殊颜色的FAB,看起来那种特殊的颜色就是强调色吗?
@KaitlynHanrahan 请查看我的更新。谢谢你的评论。
这很完美——Lollypop 和 Kitkat 看起来一样,甚至两者都有一点阴影,所以 FAB 在背景中以相同的颜色弹出(我在工具栏上部分显示了它)。非常感谢!这很简单,但我不知道我是否会自己找到它。
有没有办法以编程方式设置 app:borderWidth?谢谢
@Štarke 好吧,在查看 FloatingActionButton 的源代码之后,恐怕您现在无法以编程方式设置它,因为 mBorderWidth 没有设置器。
T
Taslim Oseni

正如 Vasil Valchev 在评论中指出的那样,它比看起来更简单,但是我在 XML 中没有注意到一个细微的差别。

<android.support.design.widget.FloatingActionButton
    android:id="@+id/profile_edit_fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="end|bottom"
    android:layout_margin="16dp"
    android:clickable="true"
    android:src="@drawable/ic_mode_edit_white_24dp"
    app:backgroundTint="@android:color/white"/>

注意它是:

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

并不是

android:backgroundTint="@android:color/white"

这一点很重要,因为这是两个完全不同的东西:android:backgroundTint="" 来自 Api 级别 21,是 Lollipop Material Design 的一部分,在 Lollipop 下面将被忽略。此外,它不会完全改变 FAB 颜色,因为它不是纯色。您必须使用 app: 才能使其工作。
谢谢,使用 android:color 导致我的应用程序崩溃,这让我发疯了!感谢您保存我的应用程序以及我剩下的理智 ;-)
@Kapenaar 没问题,在注意到之前我也挠了一阵子;)
这将如何以编程方式工作,因为在 java 端没有像 app: 和 android: 在 XML 中的区别。
@marienke,您可以使用 ColorStatesList 进行设置,发布新问题并在此处发布链接,以便我回答;)
e
ergo

如果您尝试使用应用程序更改 FAB 的颜色,则会出现一些问题。按钮的框架有不同的颜色,所以你必须做什么:

app:backgroundTint="@android:color/transparent"

并在代码中设置颜色:

actionButton.setBackgroundTintList(ColorStateList.valueOf(getResources().getColor(R.color.white)));

这适用于正常颜色。如果我给出了像 #44000000 这样的 alpha 颜色,则框架颜色问题是可重现的。
getResources.getColor() 已弃用,请考虑使用 ContextCompat.getColor(context, your colour);反而。希望能帮助到你
A
Ashana.Jackol

只需使用,

app:backgroundTint="@color/colorPrimary"

不要使用,

android:backgroundTint="@color/colorPrimary"

嗯,这导致 android studio autocomplete 给出结果使用 android:backgroundTint ,这个答案很好
t
tachyonflux

FAB 根据您的 colorAccent 着色。

<style name="AppTheme" parent="Base.Theme.AppCompat.Light">
    <item name="colorAccent">@color/accent</item>
</style>

好吧,默认颜色不是绿色。你在哪里设置了绿色?
我没有。如您所见,这个 xml 是我设置按钮布局的唯一地方......
也许您应该只使用 FAB 创建一个新项目并发布整个项目的代码。
哇...我基本上只是要求你做同样的事情而你不愿意这样做。你认为你的代码是足够的,但我对你的代码的添加是不够的,这是非常虚伪的。创建一个 MCVE 由请求者负责。谢谢。
现在不再是,基于 Theme Attribute Mapping 浮动操作按钮现在(我验证了自己)被着色为 colorSecondary (com.google.android.material:material:1.1.0-alpha02
a
atoMerz
mFab.setBackgroundTintList(ColorStateList.valueOf(ContextCompat.getColor(mContext,R.color.mColor)));

这是最简单的解决方案,比使用自定义可绘制对象更容易。
l
luca992

材料 1.1.0 中 Floating Action Button 的新主题属性映射

在您的应用主题中:

设置 colorSecondary 为 FAB 的背景设置颜色(映射到 backgroundTint)

设置 colorOnSecondary 以设置图标/文本的颜色和 FAB 的波纹颜色(映射到 tint 和ippleColor)

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- ...whatever else you declare in your app theme.. -->
    <!-- Set colorSecondary to change background of FAB (backgroundTint) -->
    <item name="colorSecondary">@color/colorSecondary</item>
    <!-- Customize colorSecondary to change icon/text of FAB (maps to tint and rippleColor) -->
    <item name="colorOnSecondary">@android:color/white</item>
</style>

最后是为 FAB 背景和前景(图标)颜色提供简单解决方案的人。
谢谢。这就是我一直在寻找的
R
Robin Davies

其他解决方案可能有效。这是 10 磅大猩猩的方法,其优点是广泛适用于这种情况和类似情况:

样式.xml:

<style name="AppTheme.FloatingAccentButtonOverlay" >
    <item name="colorAccent">@color/colorFloatingActionBarAccent</item>
</style>

你的布局xml:

<android.support.design.widget.FloatingActionButton
       android:theme="AppTheme.FloatingAccentButtonOverlay"
       ...
 </android.support.design.widget.FloatingActionButton>

嗯,这似乎应该可行,但我在布局文件 String types not allowed (at 'theme' with value 'AppTheme.FloatingAccentButtonOverlay') 中遇到编译器错误。也许我错过了styles.xml的一点......
@ScottBiggs 使用 android:theme="@style/AppTheme.FloatingAccentButtonOverlay" 但这个解决方案对我不起作用......
没有 colorAccent 属性的 API 16 呢?
G
Gabriele Mariotti

默认情况下,使用 Material Theme材质组件 FloatingActionButton 它采用 styles.xml 属性 colorSecondary 中设置的颜色。

您可以在 xml 中使用 app:backgroundTint 属性:

<com.google.android.material.floatingactionbutton.FloatingActionButton
       ...
       app:backgroundTint=".."
       app:srcCompat="@drawable/ic_plus_24"/>

您可以使用 fab.setBackgroundTintList();

您可以使用 属性自定义您的样式

  <!--<item name="floatingActionButtonStyle">@style/Widget.MaterialComponents.FloatingActionButton</item> -->
  <style name="MyFloatingActionButton" parent="@style/Widget.MaterialComponents.FloatingActionButton">
    <item name="backgroundTint">#00f</item>
    <!-- color used by the icon -->
    <item name="tint">@color/...</item>
  </style>

从材质组件的 1.1.0 版本开始,您可以使用新的 materialThemeOverlay 属性来覆盖某些组件的默认颜色:

  <style name="MyFloatingActionButton" parent="@style/Widget.MaterialComponents.FloatingActionButton">
    <item name="materialThemeOverlay">@style/MyFabOverlay</item>
  </style>

  <style name="MyFabOverlay">
    <item name="colorSecondary">@color/custom2</item>
    <!-- color used by the icon -->
    <item name="colorOnSecondary">@color/...</item>
  </style>

https://i.stack.imgur.com/OqBj9.png


V
Vijet Badigannavar

该文件建议它默认采用@color/accent。但是我们可以通过使用在代码上覆盖它

fab.setBackgroundTintList(ColorStateList)

还要记住,

使用这个库的最低 API 版本是 15,所以你需要更新它!如果你不想这样做,那么你需要定义一个自定义的drawable并装饰它!


可以,但是我必须针对 api 21+。如果我以 api 8 为目标,则无法调用此方法。
只需包含这个由谷歌“com.android.support:design:22.2.0”发布的设计库。这可以在非棒棒糖版本的设备上使用!干杯!!
我当然知道,但这是此代码的错误:调用需要 API 级别 21(当前最小值为 8):android.widget.ImageView#setBackgroundTintList
使用这个库的最低 API 版本是 15,所以你需要更新它!如果你不想这样做,那么你需要定义一个自定义的drawable并装饰它!
哦谢谢!我不知道,以为是 21,因为这是错误所说的。请将此作为答案发布,我会接受!
A
Agilanbu

使用下面的行更改浮动操作按钮的背景颜色

app:backgroundTint="@color/blue"

更改浮动操作按钮图标颜色

android:tint="@color/white"     

G
Gaurav Kumar Gupta

感谢自动完成。经过几次打击和试验后,我很幸运:

    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    card_view:backgroundTint="@color/whicheverColorYouLike"

-- 或 -- (两者基本相同)

    xmlns:app="http://schemas.android.com/apk/res-auto"
    app:backgroundTint="@color/whicheverColorYouLike"

这在 API 版本 17 和设计库 23.1.0 上对我有用。


C
Community

我遇到了同样的问题,而且都在抢我的头发。感谢这个https://stackoverflow.com/a/35697105/5228412

我们能做什么..

 favourite_fab.setImageDrawable(ContextCompat.getDrawable(getBaseContext(), R.drawable.favourite_selected));

它对我来说很好,并希望其他能到达这里的人。


虽然这在理论上可以回答问题,但it would be preferable在此处包含答案的基本部分,并提供链接以供参考。
G
Gavine Joyce
 <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:elevation="6dp"
    app:backgroundTint="@color/colorAccent"
    app:pressedTranslationZ="12dp"
    android:layout_margin="@dimen/fab_margin"
    android:src="@drawable/add"/>

请注意,您在 res/values/color.xml 中添加颜色并在您的 fab 中包含该属性

   app:backgroundTint="@color/addedColor"

J
Jan Málek

使用 Data Binding 时,您可以执行以下操作:

android:backgroundTint="@{item.selected ? @color/selected : @color/unselected}"

我做了一个非常简单的example


T
Tom

如果您有一个没有可绘制的浮动操作按钮,您可以使用以下方式以编程方式更改色调:

fab.getBackground().mutate().setTint(ContextCompat.getColor(yourContext, R.color.anyColor));

这就是我正在寻找的解决方案。我有一个带有 backgrountTint 的简单晶圆厂,但在找到它之前找不到以编程方式更改它的方法。
我使用数据绑定,我得到了 NullPointerException ......
J
Jwala Kumar

对于材料设计,我只是像这样更改了浮动操作按钮的颜色,在您的浮动操作按钮 xml 中添加以下两行。并做了,

 android:backgroundTint="@color/colorPrimaryDark"
 app:borderWidth="0dp"

s
sana sajjad

我是这样做的完成了


N
Nidia F.

我们缺少的一点是,在您为按钮设置颜色之前,为该颜色设置所需的值很重要。所以你可以去值>颜色。您会找到默认的颜色,但您也可以通过复制和粘贴来创建颜色,更改颜色和名称。然后......当你去改变浮动按钮的颜色时(在activity_main中),你可以选择你创建的那个

示例 - 值的代码 > 默认颜色的颜色 + 我创建的另外 3 种颜色:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>

    <color name="corBotaoFoto">#f52411</color>
    <color name="corPar">#8e8f93</color>
    <color name="corImpar">#494848</color>

</resources>

现在我的浮动操作按钮具有我创建并命名为“corPar”的颜色:

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

它对我有用。祝你好运!


f
fullmoon

在科特林:

val gray = getColor(requireContext(), R.color.green)
binding.fabSubmit.backgroundTintList = ColorStateList.valueOf(gray)

i
inspire_coding

我的解决方案,适用于数据绑定

val color = ContextCompat.getColor(context, R.color.colorPrimary)
binding.fab.backgroundTintList = ColorStateList.valueOf(getColor)

P
Progga Ilma

https://i.stack.imgur.com/N7Dto.png

在 color.xml 文件中添加颜色,然后添加这行代码... floatingActionButton.setBackgroundTintList(ColorStateList.valueOf(getResources().getColor(R.color.fab2_color)));


O
OhhhThatVarun

如果您想以编程方式更改颜色,可以使用此代码

floating.setBackgroundTintList(getResources().getColorStateList(R.color.vermelho));

p
passionatedevops

利用

应用程序:backgroundTint="@color/orange" 在


<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/id_share_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/share"
        app:backgroundTint="@color/orange"
        app:fabSize="mini"
        app:layout_anchorGravity="end|bottom|center" />



</androidx.coordinatorlayout.widget.CoordinatorLayout>


M
Mori

您可以使用 Extended,因此像这样设置 app:iconTint

<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
        android:id="@+id/fAB"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
       
        app:icon="@drawable/d0"
        app:iconTint="@color/white"
         />