theme_mode_handler 3.0.0 theme_mode_handler: ^3.0.0 copied to clipboard
Flutter widget to change `themeMode` during runtime and persist it across restarts
theme_mode_handler #
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, wrapMaterialApp
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