wake-up-neo.com

Ändern der Farbe der schwebenden Aktionstaste durch Android

Versucht seit Stunden, die Farbe der Floating Action-Schaltfläche von Material zu ändern, jedoch ohne Erfolg.

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

Ich habe versucht hinzuzufügen

Android:background="@color/mycolor"

oder per Code

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

oder

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

Aber nichts davon funktionierte. Ich habe auch die Lösungen in der "Duplikat-Frage" ausprobiert, aber keine davon funktioniert, Button blieb grün und wurde auch zu einem Quadrat.

Ich hätte eine ausführliche Antwort, danke.

P.S. Es wäre auch schön zu wissen, wie man den Welleneffekt hinzufügt, das konnte ich auch nicht verstehen.

javaandroidandroid-5.0-lollipopfloating-action-button
423
Jjang

Wie in der documentation beschrieben, nimmt es standardmäßig die in styles.xml Attribut colorAccent eingestellte Farbe an.

Die Hintergrundfarbe dieser Ansicht ist standardmäßig der colorAccent Ihres Themas. Wenn Sie dies zur Laufzeit ändern möchten, können Sie dies über setBackgroundTintList (ColorStateList) tun.

Wenn Sie die Farbe ändern möchten

  • in XML mit dem Attribut 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" >
  • im Code mit .setBackgroundTintList (Antwort unten mit ywwynm )

Wie @Dantalian in den Kommentaren erwähnt, können Sie, wenn Sie die Symbolfarbe ändern möchten, verwenden

Android:tint="@color/white"
878
Marko

Vijet Badigannavars Antwort ist richtig, aber ColorStateList zu verwenden ist normalerweise kompliziert und er hat uns nicht gesagt, wie es geht. Da wir uns häufig darauf konzentrieren, die Farbe von View im normalen und gedrückten Zustand zu ändern, füge ich weitere Details hinzu:

  1. Wenn Sie die Farbe von FAB im Normalzustand ändern möchten, können Sie einfach schreiben

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

  2. Wenn Sie die Farbe von FAB im gedrückten Zustand ändern möchten, danke für Design Support Library 22.2.1, können Sie einfach schreiben

    mFab.setRippleColor(your color in int);

    Wenn Sie dieses Attribut setzen, wird durch langes Drücken von FAB eine Ripple mit Ihrer Farbe an Ihrem Berührungspunkt angezeigt und in die gesamte Oberfläche von FAB eingeblendet. Bitte beachten Sie, dass die Farbe von FAB im normalen Zustand nicht geändert wird. Unterhalb von API 21 (Lollipop) gibt es keinen Ripple-Effekt. Die Farbe von FAB ändert sich jedoch, wenn Sie darauf drücken.

Wenn Sie einen komplexeren Effekt für Zustände implementieren möchten, sollten Sie zum Schluss tief in ColorStateList eintauchen. Hier wird eine SO - Frage behandelt: Wie kann ich ColorStateList programmatisch erstellen? .

UPDATE: Danke für den Kommentar von @ Kaitlyn. Um den Strich von FAB mit Hintergrundfarbe als Farbe zu entfernen, können Sie app:borderWidth="0dp" in Ihrer XML-Datei festlegen.

211
ywwynm

Wie Vasil Valchev in einem Kommentar feststellt, ist es einfacher als es aussieht, aber es gibt einen subtilen Unterschied, den ich in meinem XML nicht bemerkt habe. 

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

Beachten Sie, dass es ist:

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

und nicht 

Android:backgroundTint="@Android:color/white"
101
HenriqueMS

wenn Sie versuchen, die Farbe von FAB mithilfe der App zu ändern, haben einige Probleme . Der Rahmen der Schaltfläche hat eine andere Farbe, also müssen Sie Folgendes tun:

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

und im Code die Farbe einstellen:

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

benutz einfach,

app:backgroundTint="@color/colorPrimary"

nicht verwenden,

Android:backgroundTint="@color/colorPrimary"
41
Ashana.Jackol

Die FAB wird basierend auf Ihrer colorAccent farbig dargestellt.

<style name="AppTheme" parent="Base.Theme.AppCompat.Light">
    <item name="colorAccent">@color/accent</item>
</style>
26
tachyonflux
mFab.setBackgroundTintList(ColorStateList.valueOf(ContextCompat.getColor(mContext,R.color.mColor)));
16
Reza Isfandyari

Andere Lösungen können funktionieren. Dies ist der 10-Pfund-Gorilla-Ansatz, der den Vorteil hat, in diesem und ähnlichen Fällen breit anwendbar zu sein:

Styles.xml:

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

ihre Layout-XML:

<Android.support.design.widget.FloatingActionButton
       Android:theme="AppTheme.FloatingAccentButtonOverlay"
       ...
 </Android.support.design.widget.FloatingActionButton>
11
Robin Davies

Das Dokument legt nahe, dass es standardmäßig die @ Farbe/den Akzent nimmt. Aber wir können es mit dem Code überschreiben

fab.setBackgroundTintList(ColorStateList)

Denken Sie auch daran, 

Die Mindest-API-Version für die Verwendung dieser Bibliothek beträgt 15, daher müssen Sie sie aktualisieren! Wenn Sie dies nicht tun möchten, müssen Sie ein benutzerdefiniertes Zeichenelement definieren und es dekorieren!

9
Vijet Badigannavar
 <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"/>

Beachten Sie, dass Sie Farben in res/values ​​/ color.xml Hinzufügen und das Attribut in Ihre Datenbank aufnehmen 

   app:backgroundTint="@color/addedColor"
5
Gavine Joyce

Dank Autovervollständigung. Ich hatte Glück nach ein paar Treffern und Prüfungen:

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

- oder - (beide sind im Grunde dasselbe)

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

Dies funktionierte für mich mit der API-Version 17 mit der Designbibliothek 23.1.0.

5
Gaurav Kumar Gupta

Ich habe das gleiche Problem und es schnappt mir alle Haare. Danke dafür https://stackoverflow.com/a/35697105/5228412

Was wir tun können..

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

es funktioniert gut für mich und wünscht anderen, die hier erreichen werden.

4
Purvik Rana

Bei der Verwendung von Data Binding können Sie Folgendes tun:

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

Ich habe ein sehr einfaches Beispiel gemacht

2
Jan Málek

ich habe es so gemacht. Android: background = "@ color/colorAccent" Ich gehe einfach in den Ordner res und dann auf Ordnerwerte und dann auf colors.xml in colors.xml erledigt 

1
sana sajjad

Uns fehlt der Punkt, dass es wichtig ist, vor dem Festlegen der Farbe für die Schaltfläche den gewünschten Wert für diese Farbe festzulegen. Sie können also auf Werte> Farbe gehen. Sie finden die Standardfarben, Sie können aber auch Farben erstellen, indem Sie sie abschließen und einfügen und die Farben und Namen ändern. Wenn Sie dann die Farbe der schwebenden Schaltfläche (in activity_main) ändern, können Sie die von Ihnen erstellte auswählen 

Beispiel - Code für Werte> Farben mit Standardfarben + 3 weitere von mir erstellte Farben:

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

Nun mein Floating Action Button mit der Farbe, die ich erstellt habe und "corPar" heißt:

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

Es hat für mich funktioniert. Viel Glück!

1
Nidia F.

Ändern der Hintergrundfarbe der Floating-Aktionsschaltfläche mithilfe der unteren Zeile

app:backgroundTint="@color/blue"

Ändern der Farbe der Floating-Aktionstaste

Android:tint="@color/white"
1
Kishore Reddy

 add colors in color.xml file

fügen Sie Farben in der color.xml-Datei hinzu und fügen Sie dann diese Codezeile hinzu ...floatingActionButton.setBackgroundTintList(ColorStateList.valueOf(getResources().getColor(R.color.fab2_color)));

0
Progga Ilma

Mit dem Material Theme und den Materialkomponenten FloatingActionButton Standardmäßig wird die in _styles.xml_ festgelegte Farbe verwendet colorSecondary.

  • Sie können das Attribut app:backgroundTint in xml verwenden:
_<com.google.Android.material.floatingactionbutton.FloatingActionButton
       ...
       app:backgroundTint=".."
       app:srcCompat="@drawable/ic_plus_24"/>
_

  • Sie können fab.setBackgroundTintList(); verwenden

  • Sie können Ihren Stil mit dem Attribut <item name="backgroundTint"> anpassen

_  <!--<item name="floatingActionButtonStyle">@style/Widget.MaterialComponents.FloatingActionButton</item> -->
  <style name="MyFloatingActionButton" parent="@style/Widget.MaterialComponents.FloatingActionButton">
    <item name="backgroundTint">#00f</item>
  </style>
_
  • ab Version 1.1.0 der Materialkomponenten können Sie die neue materialThemeOverlay Attribut zum Überschreiben der Standardfarben nur für einige Komponenten:
_  <style name="MyFloatingActionButton" parent="@style/Widget.MaterialComponents.FloatingActionButton">
    <item name="materialThemeOverlay">@style/MyFabOverlay</item>
  </style>

  <style name="MyFabOverlay">
    <item name="colorSecondary">@color/custom2</item>
  </style>
_
0
Gabriele Mariotti

Neue Themenattributzuordnung für Floating Action Button in Material 1.1.0

In Ihrem App-Thema:

  • Setze colorSecondary, um eine Farbe für den Hintergrund von FAB festzulegen (ordnet backgroundTint zu)
  • Setze colorOnSecondary, um eine Farbe für das Icon/den Text und die Ripple-Farbe von FAB festzulegen (ordnet Tint und RippleColor zu)
<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>
0
luca992

sie können es verwenden, wenn Sie den Code ändern möchten floating.setBackgroundTintList (getResources (). getColorStateList (R.color.vermelho));

0
DiegoS