Skip to content

Instantly share code, notes, and snippets.

@boanergepro
Created July 1, 2019 18:55
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save boanergepro/707601017b815775136ec35daa7864cc to your computer and use it in GitHub Desktop.
Save boanergepro/707601017b815775136ec35daa7864cc to your computer and use it in GitHub Desktop.
Flutter dynamic theming - Change theme at runtime using Provider
import 'package:flutter/material.dart';
class AppProvider with ChangeNotifier {
ThemeData _currentTheme;
AppProvider() {
_currentTheme = ThemeDat.light()
}
ThemeData get currentTheme => _currentTheme;
set currentTheme(value) {
_currentTheme = value;
notifyListeners();
}
}
import 'package:flutter/material.dart';
class HomeScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: AppBar(
title: Text('Example'),
),
body: Container(
padding: EdgeInsets.only(right: 15, left: 15),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
FlatButton(
child: Text('Dark'),
onPressed: () {
appState.currentTheme = ThemeData.dark();
},
),
],
),
),
);
}
}
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:your_package/src/providers/app.dart';
import 'package:your_package/src/routes.dart';
import 'package:your_package/src/screens/home_screen.dart;
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MultiProvider(
providers: [
ChangeNotifierProvider(builder: (context) => AppProvider()),
],
child: App(),
);
}
}
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
final appState = Provider.of<AppProvider>(context);
return MaterialApp(
routes: routes,
theme: appState.currentTheme,
home: HomeScreen(),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment