Изменение цвета плавающей кнопки Android

Ответ 1

Как описано в документации, по умолчанию он принимает цвет, установленный в styles.xml атрибуте colorAccent.

Цвет фона этого представления по умолчанию соответствует цвету вашей темы. Если вы хотите изменить это во время выполнения, вы можете сделать это через setBackgroundTintList (ColorStateList).

Если вы хотите изменить цвет

• в XML с атрибутом app: backgroundTint

<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 необходимо установить границу 0dp в макете xml:

<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"
    app:borderWidth="0dp" />

Ответ 2

Ответ Vijet Badigannavar правильный, но с использованием ColorStateList обычно сложно, и он не рассказал нам, как это сделать. Поскольку мы часто фокусируемся на изменении цвета View в нормальном и нажатом состоянии, я собираюсь добавить более подробную информацию:

• Если вы хотите изменить цвет FAB в нормальном состоянии, вы можете просто написать

  mFab.setBackgroundTintList(ColorStateList.valueOf(your color in int));
  

• Если вы хотите изменить цвет FAB в нажатом состоянии, спасибо Библиотеке поддержки дизайна 22.2.1, вы можете просто написать

  mFab.setRippleColor(your color in int);
  

  Установив этот атрибут, при длительном нажатии FAB пульсация с вашим цветом появится в вашей точке касания и откроется на всей поверхности FAB. Обратите внимание, что он не изменит цвет FAB в нормальном состоянии. Ниже API 21 (Lollipop) эффект пульсации отсутствует, но цвет FAB будет меняться при нажатии.

Наконец, если вы хотите реализовать более сложный эффект для состояний, тогда вы должны глубоко вникать в ColorStateList, вот вопрос SO, обсуждающий его: Как создать программный код ColorStateList?.

UPDATE: Спасибо за комментарий @Kaitlyn. Чтобы удалить ход FAB с использованием backgroundTint в качестве его цвета, вы можете установить app:borderWidth="0dp" в свой xml.

Ответ 3

Как отметил в комментарии Василь Вальчев, это проще, чем кажется, но есть небольшая разница, которую я не заметил в своем 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"

Ответ 4

если вы попытаетесь изменить цвет FAB с помощью приложения, есть некоторые проблемы. кадр кнопки имеет разный цвет, так что вы должны сделать:

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

и в коде установите цвет:

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

Ответ 5

просто используйте

app:backgroundTint="@color/colorPrimary"

не использовать,

android:backgroundTint="@color/colorPrimary"

Ответ 6

FAB окрашен в соответствии с вашим colorAccent.

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

Ответ 7

mFab.setBackgroundTintList(ColorStateList.valueOf(ContextCompat.getColor(mContext,R.color.mColor)));

Ответ 8

Другие решения могут работать. Это 10-фунтовый подход гориллы, который имеет то преимущество, что он широко применим в этом и подобных случаях:

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

Ответ 9

Документ предполагает, что по умолчанию он принимает цвет @акцент. Но мы можем переопределить его в коде, используя

fab.setBackgroundTintList(ColorStateList)

Также помните,

Минимальная версия API для использования этой библиотеки - 15, поэтому вам необходимо ее обновить! если вы не хотите этого делать, вам нужно определить пользовательский чертеж и украсить его!

Ответ 10

Благодаря автозаполнению. Мне повезло после нескольких ударов и испытаний:

    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.

Ответ 11

У меня такая же проблема, и все это хватало моих волос. Спасибо за это  fooobar.com/questions/24346/...

Что мы можем сделать.

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

он отлично работает для меня и желает других, которые доберутся здесь.

Ответ 12

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

Ответ 13

Изменение цвета фона кнопки "Плавающая" с помощью строки ниже

app:backgroundTint="@color/blue"

Изменение цвета значка кнопки "Плавающее действие"

android:tint="@color/white"     

Ответ 14

При использовании привязки данных вы можете сделать что-то вроде этого:

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

Я сделал очень простой пример

Ответ 15

Новое отображение атрибутов темы для кнопки с плавающим действием в материале 1.1.0

В теме вашего приложения:

• Установите colorSecondary, чтобы установить цвет для фона FAB (сопоставляется с backgroundTint)
• Установите colorOnSecondary, чтобы установить цвет значка/текста и цвет пульсации FAB (сопоставляется с tint и rippleColor)

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

Ответ 16

я сделал это следующим образом android: background = "@color/colorAccent" я просто захожу в папку res, затем нажимаю на значения папки и затем на colors.xml в colors.xml я просто меняю цвет colorAccent и вызываю его в android: background и это сделано

Ответ 17

То, что нам не хватает, заключается в том, что перед установкой цвета на кнопке важно работать с тем значением, которое вы хотите для этого цвета. Таким образом, вы можете перейти к значениям > цвет. Вы найдете по умолчанию, но вы также можете создавать цвета, обходя и вставляя их, изменяя цвета и имена. Затем... когда вы идете изменить цвет плавающей кнопки (в 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"/>

Это сработало для меня. Удачи!

Ответ 18

С Материальной темой и материальными компонентами FloatingActionButton по умолчанию он принимает цвет, установленный в атрибуте styles.xml colorSecondary.

• Вы можете использовать атрибут app:backgroundTint в XML:

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

• Вы можете использовать fab.setBackgroundTintList();

• Вы можете настроить свой стиль, используя атрибут <item name="backgroundTint"> attribute

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

Ответ 19

Если вы используете Xamarin для разработки приложений для Android, используйте ниже код для изменения цвета плавающей кнопки.

FloatingActionButton fa = root.FindViewById<FloatingActionButton>(Resource.Id.fabback);
            Android.Content.Res.ColorStateList csl = new Android.Content.Res.ColorStateList(new int[][] { new int[0] }, new int[]{Android.Graphics.Color.ParseColor("#000000") });
            fab.BackgroundTintList= csl;

"# 000000" используется для черного цвета, который вы можете изменить в соответствии с вашими требованиями.

Ответ 20

Вы можете использовать этот код, если хотите изменить цвет программным способом

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

Ответ 21

добавить цвета в файл color.xml, а затем добавить эту строку кода... floatingActionButton.setBackgroundTintList(ColorStateList.valueOf(getResources().getColor(R.color.fab2_color)));

Ответ 22

можешь использовать:

app:tint="#FFFF"       

пример:

<com.google.android.material.floatingactionbutton.FloatingActionButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|start"
            android:layout_margin="16dp"
            android:layout_marginEnd="8dp"
            android:layout_marginBottom="8dp"
            app:backgroundTint="@color/colorAccent"
            app:fabSize="normal"
            app:rippleColor="@color/colorPrimaryDark"
            app:tint="#FFFF"
            android:src="@drawable/ic_search_24dp"
          />

Ответ 23

использовать

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