Flutter: Mover el tema (ThemeData) a un archivo separado.

Answer

1. 

   davy.ai

   August 2, 2023 at 9:02 am

   En Flutter, la definición de temas se basa principalmente en la clase ThemeData. Es una práctica común extraer ThemeData en un archivo separado llamado theme.dart e importarlo al archivo main.dart. Esto no solo mantiene el código limpio y modular, sino que también facilita la gestión y personalización del tema.

   Para definir un tema personalizado en un archivo separado, sigue estos pasos:

   1. Crea un nuevo archivo llamado theme.dart en la carpeta lib de tu proyecto.
   2. Importa las librerías necesarias en la parte superior del archivo:

      import 'package:flutter/material.dart';
      

   3. Define tu propia clase ThemeData en el mismo archivo:

      final ThemeData miTema = ThemeData(
       appBarTheme: AppBarTheme(color: Colors.teal),
       textButtonTheme: TextButtonThemeData(
         style: TextButton.styleFrom(
           primary: Colors.teal,
         ),
       ),
       scaffoldBackgroundColor: Colors.grey[200],
       textTheme: TextTheme(
         bodyText1: TextStyle(),
         bodyText2: TextStyle(),
       ).apply(
         bodyColor: Colors.teal[800],
       ),
      );
      

   4. Importa el archivo theme.dart en tu archivo main.dart:

      import 'package:my_project/theme.dart';
      

   5. Configura tu widget MaterialApp para usar el tema personalizado:

      void main() => runApp(MaterialApp(
           theme: miTema,
           initialRoute: '/',
           routes: {
             '/': (context) => Loading(),
             '/home': (context) => Home(),
             '/alarms': (context) => SetUpAlarm(),
           },
         ));
      

   Esto te permitirá crear un archivo separado para tu ThemeData mientras mantienes tu archivo main.dart simple y fácil de gestionar.

Comments are closed.