theme_mode_handler 3.0.0 copy "theme_mode_handler: ^3.0.0" to clipboard
theme_mode_handler: ^3.0.0 copied to clipboard

Flutter widget to change `themeMode` during runtime and persist it across restarts

theme_mode_handler #

version All Contributors

Flutter widget to change themeMode during runtime and persist it across restarts.

Motivation #

Flutter 1.9 introduced a new way to control which theme is used: MaterialApp.themeMode. If you have specified the darkTheme and theme properties, you can use themeMode to control it. The property defaults to ThemeMode.system.

This package wraps this functionality and allows you to persist and retrieve the user's preference wherever you want by implementing an interface.

Installation #

Add this to your pubspec.yaml:

dependencies:
  theme_mode_handler: ^3.0.0

Usage #

  • Create a class that implements the IThemeModeManager interface:
class MyManager implements IThemeModeManager {
  @override
  Future<String> loadThemeMode() async {}

  @override
  Future<bool> saveThemeMode(String value) async {}
}
  • Import the ThemeModeHandler widget, wrap MaterialApp with it and pass it an instance of your manager:
import 'package:theme_mode_handler/theme_mode_handler.dart';

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ThemeModeHandler(
      manager: MyManager(),
      builder: (ThemeMode themeMode) {
        return MaterialApp(
          themeMode: themeMode,
          darkTheme: ThemeData(
            brightness: Brightness.dark,
          ),
          theme: ThemeData(
            brightness: Brightness.light,
          ),
          home: MyHomePage(title: 'Flutter Demo Home Page'),
        );
      },
    );
  }
}
  • Change the themeMode with:
ThemeModeHandler.of(context).saveThemeMode(value);
  • Get the current themeMode with:
ThemeModeHandler.of(context).themeMode;

Check the example folder for a complete example.

API #

builder #

Type: Widget Function(ThemeMode themeMode).

Function that runs when themeMode changes.

manager #

Type: IThemeModeManager.

Implementation of IThemeModeManager to load and save the selected value.

defaultTheme

Type: ThemeMode.

Default value to be used when manager.loadThemeMode returns null or an invalid value.

placeholderWidget #

Type: Widget?.

While the themeMode is loaded, you can choose to render a different widget. By default, it'll render an empty container.

Extra #

This package exports a dialog and a method to simplify its usage.

  • Import the dialog with:
import 'package:theme_mode_handler/theme_picker_dialog.dart';
  • Use it like this:
void _selectThemeMode(BuildContext context) async {
  final newThemeMode = await showThemePickerDialog(context: context);
  print(newThemeMode);
}

Inspiration #

This package is inspired and based on the great package dynamic_theme.

Contributors ✨ #

Thanks goes to these wonderful people (emoji key):


Arthur Denner

💻 🎨 💡 🚧

This project follows the all-contributors specification. Contributions of any kind welcome!

License #

MIT © Arthur Denner

20
likes
160
pub points
84%
popularity

Publisher

unverified uploader

Flutter widget to change `themeMode` during runtime and persist it across restarts

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on theme_mode_handler