persist_theme

A Flutter plugin for persisting and dynamically changing the theme.

Online Demo: https://fluttercommunity.github.io/persist_theme/

import'package:flutter/material.dart';
import'package:persist_theme/persist_theme.dart';
import'package:provider/provider.dart';
import'package:scoped_model/scoped_model.dart';
import'dart:io'show Platform;
import'package:flutter/foundation.dart';
/// main is entry point of Flutter applicationvoidmain() {
// Desktop platforms aren't a valid platform._setTargetPlatformForDesktop();
returnrunApp(MyApp());
}
/// If the current platform is desktop, override the default platform to/// a supported platform (iOS for macOS, Android for Linux and Windows)./// Otherwise, do nothing.void_setTargetPlatformForDesktop() {
TargetPlatform targetPlatform;
if (Platform.isMacOS) {
targetPlatform =TargetPlatform.iOS;
} elseif (Platform.isLinux ||Platform.isWindows) {
targetPlatform =TargetPlatform.android;
}
if (targetPlatform !=null) {
debugDefaultTargetPlatformOverride = targetPlatform;
}
}
final _model =ThemeModel();
classMyAppextendsStatelessWidget {
@overrideWidgetbuild(BuildContext context) {
returnListenableProvider<ThemeModel>(
create: (_) => _model..init(),
child:Consumer<ThemeModel>(
builder: (context, model, child) {
returnMaterialApp(
theme: model.theme,
home:HomeScreen(),
);
},
),
);
}
}
classHomeScreenextendsStatelessWidget {
@overrideWidgetbuild(BuildContext context) {
final _theme =Provider.of<ThemeModel>(context);
returnScaffold(
appBar:AppBar(
title:constText('Persist Theme'),
),
body:ListView(
children:MediaQuery.of(context).size.width >=480?<Widget>[
Flex(
direction:Axis.horizontal,
children:<Widget>[
Flexible(child:DarkModeSwitch()),
Flexible(child:TrueBlackSwitch()),
],
),
CustomThemeSwitch(),
Flex(
direction:Axis.horizontal,
children:<Widget>[
Flexible(child:PrimaryColorPicker()),
Flexible(child:AccentColorPicker()),
],
),
DarkAccentColorPicker(),
]
:<Widget>[
DarkModeSwitch(),
TrueBlackSwitch(),
CustomThemeSwitch(),
PrimaryColorPicker(),
AccentColorPicker(),
DarkAccentColorPicker(),
],
),
floatingActionButton:FloatingActionButton(
backgroundColor: _theme.accentColor,
child:Icon(Icons.add),
onPressed: () {},
),
);
}
}

Customization

• There are widgets provided but can be fully customized.
• By default hide elements based on the theme.
• The only requirement is that the material app is wrapped in a scoped model like shown above.

Screenshots