floatingactionbutton color bootstrap android floating-action-button

android - bootstrap - Establecer el color del icono FAB



floating action button size (6)

Como FloatingActionButton extiende ImageView , podemos usar ImageViewCompat para teñir el icono:

ImageViewCompat.setImageTintList( floatingActionButton, ColorStateList.valueOf(Color.WHITE) );


FAB actual

Me gustaría saber cómo cambiar el color del icono del widget FAB (botón de acción flotante) suministrado por la biblioteca ''com.android.support:design:22.2.0'' de verde a blanco.

style.xml

<resources> <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="colorPrimary">@color/color_primary</item> <item name="colorPrimaryDark">@color/color_primary_dark</item> <item name="colorAccent">@color/accent</item> </style> <color name="color_primary">#00B33C</color> <color name="color_primary_dark">#006622</color> <color name="accent">#FFB366</color>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <include android:id="@+id/toolbar" layout="@layout/toolbar" /> <TextView android:id="@+id/text" android:text="@string/hello_world" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="16dp" android:paddingTop="16dp" android:textSize="20sp" /> <android.support.v7.widget.RecyclerView android:id="@+id/recycler_view" android:scrollbars="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingLeft="8dp" android:paddingRight="8dp" android:paddingTop="8dp" android:paddingBottom="16dp" /> </LinearLayout> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="end|bottom" android:src="@android:drawable/ic_input_add" android:layout_margin="24dp" app:elevation="6dp" app:pressedTranslationZ="12dp" app:borderWidth="0dp" />


Es más fácil que obtener los elementos dibujables, solo necesita acceder al filtro de color y configurarlo en el color que desee.

FloatingActionButton myFab = (FloatingActionButton) findViewById(R.id.myfabid); myFab.setColorFilter(Color.WHITE);


Puede cambiarlo mediante programación utilizando ColorFilter.

//get the drawable Drawable myFabSrc = getResources().getDrawable(android.R.drawable.ic_input_add); //copy it in a new one Drawable willBeWhite = myFabSrc.getConstantState().newDrawable(); //set the color filter, you can use also Mode.SRC_ATOP willBeWhite.mutate().setColorFilter(Color.WHITE, PorterDuff.Mode.MULTIPLY); //set it to your fab button initialized before myFabName.setImageDrawable(willBeWhite);


Si está utilizando Material Components

<com.google.android.material.floatingactionbutton.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="16dp" android:layout_gravity="bottom|end" app:fabSize="normal" app:tint="@color/colorAccent" app:srcCompat="@drawable/ic_google"/>

Si desea utilizar el color predeterminado del icono, cambie la app:tint="@null"


Usando la propiedad android: tint puedes configurar el color de esta manera

<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:tint="@android:color/white" android:src="@android:drawable/ic_input_add" />


Use la versión blanca de ic_add del sitio de diseño de google.

android:tint parece una solución limpia pero no es compatible por debajo del nivel 21 de API

El uso de un mapa de bits agrega menos complejidad a su aplicación que intentar cambiar el color de un icono existente mediante programación. Menos complejidad significa menos cosas para probar :)