custom_theme 1.9.1

Custom theme with user data support. Plugin wrap standard Flutter ThemeData to CustomData and allow to add some user defined data.

custom_theme plugin

Custom theme with user data support.

Plugin wrap standard Flutter ThemeData to CustomData and allow to add some user defined data. Wrapped data is passed to MaterialApp theme and darkTheme params and then can be easily retrieved later and used anywhere in widgets tree.

Getting Started

Create class with your data:

class MyData {
  MyData({
    this.squareColor = Colors.greenAccent,
    this.size = 100,
    this.text = "Theme1",
    this.duration = const Duration(milliseconds: 300),
  });

  final Color squareColor;

  final double size;

  final String text;

  final Duration duration;
}

Create any number of themes with standard Flutter ThemeData and user data combined:

class LightTheme1 extends CustomTheme<MyData> {
  LightTheme1()
      : super(
          themeData: ThemeData.light().copyWith(
              primaryColor: Colors.pink[300],
              accentColor: Colors.yellow,
              floatingActionButtonTheme: ThemeData.light()
                  .floatingActionButtonTheme
                  .copyWith(backgroundColor: Colors.yellow)),
          userData: MyData(),
        );
}

Add dark theme if needed:

class DarkTheme extends CustomTheme<MyData> {
  DarkTheme()
      : super(
          themeData: ThemeData.dark().copyWith(
            primaryColor: Colors.purple,
            textTheme: ThemeData.dark().textTheme.copyWith(
                  body1: ThemeData.dark().textTheme.body1.copyWith(
                        color: Colors.cyan,
                      ),
                ),
          ),
          userData: MyData(
            text: "Dark",
            squareColor: Colors.pink[200],
            size: 80,
            duration: const Duration(milliseconds: 800),
          ),
        );
}

Fill properties of your MaterialApp:

    return MaterialApp(
          title: 'Flutter Demo',
          theme: theme,
          darkTheme: DarkTheme(),
          home: child,
        );
}

• where theme is your currently selected theme - see example how to change theme with ValueListenableBuilder.

To access user data anywhere in the app widget tree call getMyData function:

    Text(
      CustomTheme.get<MyData>(context).text,
    ),

To access standard theme you can call Theme.of(context) as usual or CustomTheme.of(context)

Simple, is't it? No inherited widgets, no tricks with dark theme - data is provided as usual Theme.of call.