Android FAB icon always black with MaterialComponents theme
I solved this by using:
app:tint="@color/COLOR_OF_ICON"
and NOT:
android:tint="@color/COLOR_OF_ICON"
For MaterialComponents
Theme you can define the following colors.
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar"> <item name="colorPrimary">@color/primary</item> <item name="colorPrimaryDark">@color/primaryDark</item> <item name="colorPrimaryVariant">@color/primaryVariant</item> <item name="colorOnPrimary">@color/onPrimary</item> <item name="colorSecondary">@color/secondary</item> <item name="colorSecondaryVariant">@color/secondaryVariant</item> <item name="colorOnSecondary">@color/onSecondary</item> <item name="colorAccent">@color/accent</item> <item name="colorSurface">@color/surface</item> <item name="colorOnSurface">@color/onSurface</item> <item name="colorError">@color/error</item> <item name="colorOnError">@color/onError</item> <item name="colorButtonNormal">@color/buttonNormal</item> <item name="colorControlNormal">@color/controlNormal</item> <item name="colorControlActivated">@color/controlActivated</item> <item name="colorControlHighlight">@color/controlHighlight</item> <item name="colorBackgroundFloating">@color/backgroundFloating</item> </style>
colorSecondary
is the responsible color forFloatingActionButton
. andcolorOnSecondary
is the responsible color for icon color ofFloatingActionButton
.
In your AppTheme
you have not defied the colorSecondary
. So, it took the default black color from parent Theme.MaterialComponents.Light.DarkActionBar
.
Reference : Android dev summit, 2018 - The Components of Material Design
As said in this answer, if your icon has multiple colors or if you want to retain your icon original color, then assign @null
as the tint:
app:tint="@null"