Cómo crear y mostrar un mensaje emergente

Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Prueba la forma de Compose

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

Barra de notificaciones →

Puedes usar un Snackbar para mostrar un mensaje breve al usuario. A diferencia de las notificaciones, el mensaje desaparece automáticamente después de un período corto. Un Snackbar es ideal para mensajes breves en los que no es necesario que el usuario realice ninguna acción. Por ejemplo, una app de correo electrónico puede usar un Snackbar para indicarle al usuario que la app envió correctamente un correo electrónico.

Cómo usar un objeto CoordinatorLayout

Un Snackbar se adjunta a una vista. Snackbar proporciona una funcionalidad básica si se adjunta a cualquier objeto derivado de la clase View, como cualquiera de los objetos de diseño comunes. Sin embargo, si el Snackbar está unido a un CoordinatorLayout, el Snackbar obtiene funciones adicionales:

• El usuario puede descartar el Snackbar deslizándolo hacia afuera.
• El diseño mueve otros elementos de la IU cuando aparece el Snackbar. Por ejemplo, si el diseño tiene un FloatingActionButton, el diseño mueve el botón hacia arriba cuando muestra un Snackbar, en lugar de dibujar el Snackbar sobre el botón. Esto se muestra en la figura 1.

La clase CoordinatorLayout proporciona un superconjunto de la funcionalidad de FrameLayout. Si tu app ya usa un FrameLayout, puedes reemplazar ese diseño por un CoordinatorLayout para habilitar la funcionalidad completa de Snackbar. Si tu app usa otros objetos de diseño, une los elementos de diseño existentes en un CoordinatorLayout, como se muestra en el siguiente ejemplo:

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/myCoordinatorLayout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- Here are the existing layout elements, now wrapped in
         a CoordinatorLayout. -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <!-- ...Toolbar, other layouts, other elements... -->

    </LinearLayout>

</android.support.design.widget.CoordinatorLayout>

Establece una etiqueta android:id para tu CoordinatorLayout. Necesitas el ID del diseño cuando muestras el mensaje.

Figura 1: El CoordinatorLayout mueve el FloatingActionButton hacia arriba cuando aparece el Snackbar.

Muestra un mensaje

Hay dos pasos para mostrar un mensaje. Primero, creas un objeto Snackbar con el texto del mensaje. Luego, llamas al método show() de ese objeto para mostrarle el mensaje al usuario.

Crea un objeto Snackbar

Crea un objeto Snackbar llamando al método Snackbar.make() estático. Cuando creas el Snackbar, especifica el mensaje que se muestra y la duración:

val mySnackbar = Snackbar.make(view, stringId, duration)

Snackbar mySnackbar = Snackbar.make(view, stringId, duration);

vista

Es la vista a la que se adjunta el Snackbar. El método busca la jerarquía de vistas desde la vista pasada hasta que llega a un CoordinatorLayout o a la vista de contenido de la decoración de la ventana. Por lo general, es más sencillo pasar el CoordinatorLayout que incluye tu contenido.

stringId

Es el ID de recurso del mensaje que deseas mostrar. Puede ser texto con formato o sin formato.

de vistas

Es la cantidad de tiempo que se muestra el mensaje. Puede ser LENGTH_SHORT o LENGTH_LONG.

Cómo mostrar el mensaje al usuario

Después de crear Snackbar, llama a su método show() para mostrar el Snackbar al usuario:

mySnackbar.show()

mySnackbar.show();

El sistema no muestra varios objetos Snackbar al mismo tiempo, por lo que, si la vista muestra otro Snackbar, el sistema pone tu Snackbar en cola y lo muestra después de que venza o se descarte el Snackbar vigente.

Si quieres mostrar un mensaje al usuario y no necesitas llamar a ninguno de los métodos de utilidad del objeto Snackbar, no es necesario que mantengas la referencia al Snackbar después de llamar a show(). Por este motivo, es común usar el método de encadenamiento para crear y mostrar un Snackbar en una declaración:

Snackbar.make(
        findViewById(R.id.myCoordinatorLayout),
        R.string.email_sent,
        Snackbar.LENGTH_SHORT
).show()

Snackbar.make(findViewById(R.id.myCoordinatorLayout), R.string.email_sent,
                        Snackbar.LENGTH_SHORT)
        .show();