1. 定义local_srorage.dart文件
使用Flutter第三方插件shared_preferences实现存储键值对信息
相关shared_preferences插件可参考: flutter 本地存储 (shared_preferences)
import 'dart:convert';
import 'package:shared_preferences/shared_preferences.dart';
class LocalStorage {
static Future get(String key) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
return prefs.getString(key);
}
static Future set(String key, String value) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
prefs.setString(key, value);
}
static Future setJSON(String key, value) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
value = json.encode(value); //对value进行编码,将
对象传递给json.encode
方法
prefs.setString(key, value);
}
static Future remove(String key) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
prefs.remove(key);
}
}
2. 定义provide 状态管理
index.dart
该dart文件中涉及的Provide状态管理参考: https://www.cnblogs.com/john-hwd/p/10790460.html
import 'package:flutter/material.dart';
import 'package:provide/provide.dart';
export 'package:provide/provide.dart'; // 暴露Provider方法,不写此句也可在其他页面再次import
import 'package:flutter_smart_park/untils/local_storage.dart';
class ConfigProvide with ChangeNotifier {
var parentContext; // 接受Provider所传的context
increment(context) { // provider的model
parentContext = context;
notifyListeners();
}
// 主题
String theme = 'purple';
Future $getTheme() async {
String _theme = await LocalStorage.get('theme');
print('++++++++++++++++++++');
print(_theme);
if (_theme != null) {
$setTheme(_theme);
}
}
Future $setTheme(payload) async {
theme = payload;
LocalStorage.set('theme', payload);
notifyListeners();
}
}
final providers = Providers() //将ConfigProvide对象添加进providers
..provide(Provider<ConfigProvide>.value(ConfigProvide()));
3. 定义theme.dart
import ......
... // 引用所需第三方库
Map materialColor = { // 主副颜色
'purple': {
"primaryColor": 0xFF7B1FA2,
"primaryColorLight": 0xFF9C27B0,
},
'pink': {
"primaryColor": 0xFFc2185b,
"primaryColorLight": 0xFFd81b60,
},
'deeppink': {
"primaryColor": 0xFFf50057,
"primaryColorLight": 0xFFe91e63,
},
'blue': {
"primaryColor": 0xFF1976D2,
"primaryColorLight": 0xFF2196F3,
},
};
class AppTheme {
static Map mainColor = materialColor['purple']; // 默认颜色
static getThemeData(String theme) { // 获取theme方法: getThemeData();
mainColor = materialColor[theme]; // 设置主题颜色
ThemeData themData = ThemeData(
// scaffoldBackgroundColor: Colors.red, // 页面的背景颜色
primaryColor: Color(mainColor["primaryColor"]), // 主颜色
primaryColorLight: Color(mainColor["primaryColorLight"]),
// 按钮颜色
buttonTheme: ButtonThemeData(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(5.0),
),
textTheme: ButtonTextTheme.normal,
buttonColor: Color(mainColor["primaryColor"]),
),
// 小部件的前景色(旋钮,文本,过度滚动边缘效果等)。
accentColor: Color(mainColor["primaryColor"]),
// appbar样式
appBarTheme: AppBarTheme(
iconTheme: IconThemeData(color: Colors.white),
textTheme: TextTheme(
title: TextStyle(
color: Colors.white,
fontSize: 20.0,
),
),
),
// 图标样式
iconTheme: IconThemeData(
color: Color(mainColor["primaryColor"]),
),
// 用于自定义对话框形状的主题。
dialogTheme: DialogTheme(
backgroundColor: Colors.white,
titleTextStyle: TextStyle(
fontSize: 18.0,
color: Colors.black87,
),
),
);
return themData;
}
}
ThemeData属性详解: https://www.jianshu.com/p/059c5794b29c
4. main.dart 应用
import 'package:flutter/material.dart';
import 'package:flutter_smart_park/config/theme.dart' show AppTheme; //主题
import 'package:flutter_smart_park/pages/page.dart';
import 'package:flutter_smart_park/common/common.dart';
void main() async {
runApp(ProviderNode(child: MyApp(), providers: providers)); //将状态放入顶层
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
Provide.value<ConfigProvide>(context).$getTheme(); //修改当前主题
return Provide<ConfigProvide>( // 使用主题
builder: (context, child, configProvide) {
return MaterialApp(
title: '智慧园区',
debugShowCheckedModeBanner: false, //调试显示检查模式横幅
onGenerateRoute: Routes.router.generator, //生成路由
theme: AppTheme.getThemeData(configProvide.theme),
home: Pages(),
);
},
);
}
}
MaterialApp 详解: https://www.jianshu.com/p/57c7d66c7688