Cómo agregar un botón de acción flotante

Prueba hacerlo con Compose

Jetpack Compose es el kit de herramientas de IU recomendado para Android. Obtén información para agregar componentes en Compose.

Botón de acción flotante →

Un botón de acción flotante (BAF) es un botón circular que activa la acción principal en la IU de tu app. En este documento, se muestra cómo agregar un FAB a tu diseño, personalizar parte de su apariencia y responder a las presiones de los botones.

Si quieres obtener más información para diseñar un FAB para tu app según los lineamientos de Material Design, consulta FAB de Material Design.

Cómo agregar el botón de acción flotante a tu diseño

En el siguiente código, se muestra cómo aparece FloatingActionButton en tu archivo de diseño:

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:src="@drawable/ic_my_icon"
        android:contentDescription="@string/submit"
        android:layout_margin="16dp" />

De forma predeterminada, el color de un FAB se define con el atributo colorAccent, que puedes personalizar con la paleta de colores del tema.

Puedes configurar otras propiedades del FAB con atributos XML o métodos correspondientes, como los siguientes:

• El tamaño del FAB, con el atributo app:fabSize o el método setSize()
• El color de la onda del FAB, con el atributo app:rippleColor o el método setRippleColor()
• El ícono del FAB, con el atributo android:src o el método setImageDrawable()

Cómo responder a presiones de botones

Luego, puedes aplicar un View.OnClickListener para controlar las presiones del FAB. Por ejemplo, el siguiente código muestra un Snackbar cuando el usuario presiona el FAB:

val fab: View = findViewById(R.id.fab)
fab.setOnClickListener { view ->
    Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG)
            .setAction("Action", null)
            .show()
}

FloatingActionButton fab = findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG)
                .setAction("Action", null).show();
    }
});

Para obtener más información sobre las capacidades del FAB, consulta la referencia de la API de FloatingActionButton.