Probando theme_provider en Flutter
¡Buenas a todos! En este post vamos a hablar de un paquete relativamente joven que nos permite cambiar fácilmente de tema actual en nuestra aplicación
Creando nuestra aplicación
Después de esta acción seleccionaremos donde queremos inicializar el proyecto y nos creará una estructura de proyecto de Flutter.
Theme_provider
Podemos encontrar este paquete alojado en pub.dev y siguiendo las instrucciones de instalación donde únicamente deberemos añadirlo a nuestro pubspec.yaml ya lo tendríamos listo para usar
Uso en nuestro código
Si seguimos los pasos de su documentación nos explica que para poder empezar a usar su paquete debemos importarlo en los ficheros que queramos usar y únicamente encapsular la parte de la aplicación donde queramos cambiar nuestros temas dinámicamente.
En nuestro caso encapsularemos toda nuestra MaterialApp (Donde comienza nuestra aplicación) dentro del objeto ThemeProvider
Para declarar los paquetes que queremos usar declaramos un array dentro de la propiedad themes del objeto que contendrá nuestra lista de AppTheme
El objeto AppTheme recibe como parámetros un id único por cada tema como String y un data que recibe un ThemeData. (En versiones anteriores del paquete 0.32 necesitaba un description para poder funcionar, a partir de la 0.33 ya no es necesario aunque en la fecha que escribo el post, todavía no está disponible).
Ahora necesitamos un objeto que se nutra de nuesto ThemeProvider, para ello tenemos otro objeto llamado ThemeConsumer que encapsulará los widgets que podrán hacer uso de nuestro provider de temas. En nuestro caso encapsulará a nuestro HomePage.
Cambio entre temas
El paquete nos proporciona dos métodos que nos permiten cambiar de tema. El primero nos permite cambiar secuencialmente de tema con el uso de ThemeProvider
Usaremos un MaterialButton para cambiar el tema por cada pulsación del usuario
Cuando lo probamos:
El segundo método nos permite cambiar entre temas usando el id con el que hemos guardado el tema, creamos otros botones que nos aplicarán directamente el tema que elijamos
Con el siguiente resultado
Preguntar al usuario sobre que tema prefiere
El paquete nos provee de otros objetos para poder preguntar al usuario que tema escoger y aplicar de los que tenemos guardados, en este caso con un ThemeDialog nos muestra todos los temas
Aquí podemos ver como se despliega
Guardar la preferencia del tema
El paquete también nos provee de unos métodos para poder guardar en disco los temas que el usuario ha elegido y también para poder cargar el último tema seleccionado al inicio de la aplicación
Agradecimientos
Vemos como este paquete nos brinda la opción de cambiar el tema actual de la aplicación de una forma muy sencilla y con una gran documentación. Agradecer al autor el tiempo dedicado para hacer este proyecto y animaros a contribuir de forma activa en el github del proyecto.
En este repo tendréis todo el código de la aplicación que he creado para este post
¡Un saludo y hasta la próxima!
