SnackBar mensajes en pantalla

 Un SnackBar en Flutter es un widget que muestra un mensaje breve en la parte inferior de la pantalla, generalmente para proporcionar información al usuario sobre una acción que ha realizado o para mostrar un error. Piensa en él como una pequeña notificación que aparece por unos segundos y luego desaparece.

Características principales de un SnackBar:

  • Duración: Por defecto, un SnackBar se muestra durante unos segundos y luego se oculta automáticamente.
  • Acción: Opcionalmente, puedes agregar una acción (un botón) al SnackBar para que el usuario pueda realizar alguna acción en respuesta al mensaje.
  • Personalización: Puedes personalizar el texto, el color de fondo, la acción y la duración del SnackBar.

Ejemplo:

Dart
import 'package:flutter/material.dart';

class MiWidgetConSnackBar extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Ejemplo de SnackBar'),
      ),
      body: Center(
        child:    ElevatedButton(
          onPressed: () {
            ScaffoldMessenger.of(context).showSnackBar(
              SnackBar(
                content: Text('¡Acción realizada con éxito!'),
                action: SnackBarAction(
                  label: 'Deshacer',
                  onPressed: () {
                    // Aquí puedes implementar la lógica para deshacer la acción
                    print('Deshacer acción');
                  },
                ),
              ),
            );
          },
          child: Text('Mostrar SnackBar'),
        ),
      ),
    );
  }
}

Explicación del código:

  1. ScaffoldMessenger: Es un servicio que proporciona acceso a la pila de SnackBar.
  2. showSnackBar: Este método muestra un SnackBar en la parte inferior de la pantalla.
  3. SnackBar: Este widget define el contenido del SnackBar, incluyendo el texto y la acción opcional.
  4. SnackBarAction: Este widget define la acción que se mostrará en el SnackBar.

En este ejemplo:

  • Al presionar el botón "Mostrar SnackBar", se muestra un SnackBar con el mensaje "¡Acción realizada con éxito!".
  • El SnackBar también incluye un botón "Deshacer" que, si se presiona, ejecuta una función (en este caso, simplemente imprime un mensaje en la consola, pero podrías implementar una lógica más compleja para deshacer la acción).

Usos comunes de los SnackBar:

  • Confirmaciones: Para confirmar que una acción se ha realizado correctamente.
  • Errores: Para mostrar mensajes de error al usuario.
  • Avisos: Para alertar al usuario sobre eventos importantes.

Personalización:

Puedes personalizar los SnackBar de muchas maneras, como cambiar el color de fondo, el estilo del texto, la duración, la posición en la pantalla, y más.

En resumen:

Los SnackBar son una herramienta útil para proporcionar retroalimentación al usuario y mejorar la experiencia de usuario de tu aplicación Flutter. Son fáciles de usar y altamente personalizables.

Comentarios

Entradas más populares de este blog

Paquete http en Flutter

Image

Menú lateral Drawer.