### 主题
```
// 1.main主文件
import 'package:flutter_smart_park/config/theme.dart' show AppTheme; Provide.value<ConfigModel>(context).$getTheme(); Provide<ConfigModel>(
builder: (context, child, configModel) {
return MaterialApp(
title: '智慧xx区',
debugShowCheckedModeBanner: false,
onGenerateRoute: Routes.router.generator,
theme: AppTheme.getThemeData(configModel.theme),
home: WillPopScope(
onWillPop: () async {
timerCountDown = TimerUtil(mInterval: 1000, mTotalTime: 1 * 1000);
timerCountDown.setOnTimerTickCallback((int value) {
if (value == 0) {
AndroidBackTop.cancelBackDeskTop();
}
});
timerCountDown.startCountDown();
AndroidBackTop.backDeskTop();
return false;
},
child: Pages(),
),
);
},
);
// 2.theme 主题文件
import 'package:flutter/material.dart'; 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) {
mainColor = materialColor[theme];
ThemeData themData = ThemeData(
// scaffoldBackgroundColor: Colors.red, // 页面的背景颜色 primaryColor: Color(mainColor["primaryColor"]), // 主颜色
primaryColorLight: Color(mainColor["primaryColorLight"]),
// 按钮颜色
buttonTheme: ButtonThemeData(
textTheme: ButtonTextTheme.primary,
buttonColor: 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"]),
),
);
return themData;
}
} // 3.provide 状态管理文件
import 'package:flutter_smart_park/untils/local_storage.dart';
class ConfigInfo {
String theme = 'purple'; // 默认主题颜色
} class ConfigModel extends ConfigInfo with ChangeNotifier { // 将主题颜色保存至本地存储,持久化
Future $getTheme() async {
String _theme = await LocalStorage.get('theme');
if (_theme != null) {
$setTheme(_theme);
}
} Future $setTheme(payload) async {
theme = payload;
LocalStorage.set('theme', payload);
notifyListeners();
}
}
// 4.local_storage文件
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);
prefs.setString(key, value);
} static Future remove(String key) async {
SharedPreferences prefs = await SharedPreferences.getInstance();
prefs.remove(key);
}
} // 使用
Theme.of(context).primaryColor, ``` ```
(new) ThemeData({Brightness brightness, MaterialColor primarySwatch, Color primaryColor, Brightness primaryColorBrightness, Color primaryColorLight, Color primaryColorDark, Color accentColor, Brightness accentColorBrightness, Color canvasColor, Color scaffoldBackgroundColor, Color bottomAppBarColor, Color cardColor, Color dividerColor, Color highlightColor, Color splashColor, InteractiveInkFeatureFactory splashFactory, Color selectedRowColor, Color unselectedWidgetColor, Color disabledColor, Color buttonColor, ButtonThemeData buttonTheme, Color secondaryHeaderColor, Color textSelectionColor, Color cursorColor, Color textSelectionHandleColor, Color backgroundColor, Color dialogBackgroundColor, Color indicatorColor, Color hintColor, Color errorColor, Color toggleableActiveColor, String fontFamily, TextTheme textTheme, TextTheme primaryTextTheme, TextTheme accentTextTheme, InputDecorationTheme inputDecorationTheme, IconThemeData iconTheme, IconThemeData primaryIconTheme, IconThemeData accentIconTheme, SliderThemeData sliderTheme, TabBarTheme tabBarTheme, CardTheme cardTheme, ChipThemeData chipTheme, TargetPlatform platform, MaterialTapTargetSize materialTapTargetSize, PageTransitionsTheme pageTransitionsTheme, AppBarTheme appBarTheme, BottomAppBarTheme bottomAppBarTheme, ColorScheme colorScheme, DialogTheme dialogTheme, Typography typography, CupertinoThemeData cupertinoOverrideTheme}) → ThemeData
package:flutter Create a [ThemeData] given a set of preferred values. Default values will be derived for arguments that are omitted. The most useful values to give are, in order of importance: The desired theme [brightness]. The primary color palette (the [primarySwatch]), chosen from one of the swatches defined by the material design spec. This should be one of the maps from the [Colors] class that do not have "accent" in their name. The [accentColor], sometimes called the secondary color, and, if the accent color is specified, its brightness ([accentColorBrightness]), so that the right contrasting text color will be used over the accent color. See https://material.io/design/color/ for more discussion on how to pick the right colors. ``` ```
(new) ButtonThemeData({ButtonTextTheme textTheme: ButtonTextTheme.normal, double minWidth: 88.0, double height: 36.0, EdgeInsetsGeometry padding, ShapeBorder shape, ButtonBarLayoutBehavior layoutBehavior: ButtonBarLayoutBehavior.padded, bool alignedDropdown: false, Color buttonColor, Color disabledColor, Color highlightColor, Color splashColor, ColorScheme colorScheme, MaterialTapTargetSize materialTapTargetSize}) → ButtonThemeData
package:flutter Create a button theme object that can be used with [ButtonTheme] or [ThemeData]. The [textTheme], [minWidth], [height], [alignedDropDown], and [layoutBehavior] parameters must not be null. The [minWidth] and [height] parameters must greater than or equal to zero. The ButtonTheme's methods that have a [MaterialButton] parameter and have a name with a get prefix are used by [RaisedButton], [OutlineButton], and [FlatButton] to configure a [RawMaterialButton]. ```

  

flutter 主题切换的更多相关文章

  1. 基于 Flutter 以两种方式实现App主题切换

    概述 App主题切换已经成为了一种流行的用户体验,丰富了应用整体UI视觉效果.例如,白天夜间模式切换.实现该功能的思想其实不难,就是将涉及主题的资源文件进行全局替换更新.说到这里,我想你肯定能联想到一 ...

  2. Android 主题切换 小结

    前言 我们用手机的时候经常看到 设置里面有夜间模式和白天模式来更换APP的主题,以前以为很简单,但是实际做起来还是有各种不完美,那么我们也要去了解各种解决方案来丰富我们的知识,现在我们就来看看各种优劣 ...

  3. windows phone主题切换(换肤)

    之前项目做了个主题切换的功能,最后客户没来得及出第二套界面给放弃了,默哀中... 为了不让它就这样流产了,就放博客共享吧. 首先说明下原理:这个切换是通过重写资源字典里指定的样式,在运行的过程中加载指 ...

  4. Android主题切换方案总结

    所谓的主题切换,就是能够根据不同的设定,呈现不同风格的界面给用户,也就是所谓的换肤. 1.将主题包(图片与配置)存到SD卡上(可通过下载或手动放入指定目录),在代码里强制从本地文件创建图片与配置文字大 ...

  5. extjs folder is lost解决方法 和 FineUI主题切换时 iframe内的内容主题不变的解决方法

    错误原因:extjs包和FineUI版本不一致 或者是 webconfig配置中 没有设置为任何人可访问  解放方法下载和FineUI版本相同的extjs包就ok了 解决方法:FineUI主题切换时 ...

  6. iOS开发之App主题切换完整解决方案(Swift版)

    本篇博客就来介绍一下iOS App中主题切换的常规做法,当然本篇博客中只是提到了一种主题切换的方法,当然还有其他方法,在此就不做过多赘述了.本篇博客中所涉及的Demo完全使用Swift3.0编写完成, ...

  7. CI框架主题切换的功能

    CI框架主题切换的功能 本人接触到这个框架不就,属于菜鸟 , 公司现在用CI框架做项目 ,老大要做一个主题切换的功能,说明功能的要求我的脑子里瞬间有几个想法. 脑子里最简单的就是设置全局变量 如 : ...

  8. Android主题切换—夜间/白天模式探究

    现在市面上众多阅读类App都提供了两种主题:白天or夜间. 上述两幅图片,正是两款App的夜间模式效果,所以,依据这个功能,来看看切换主题到底是怎么实现的(当然现在github有好多PluginThe ...

  9. ASP.NET Core 中的SEO优化(4):自定义视图路径及主题切换

    系列回顾 <ASP.NET Core 中的SEO优化(1):中间件实现服务端静态化缓存> <ASP.NET Core 中的SEO优化(2):中间件中渲染Razor视图> < ...

随机推荐

  1. Python基础(os模块)

    os模块用于操作系统级别的操作: os.getcwd() 获取当前工作目录,即当前python脚本工作的目录路径 os.chdir("dirname") 改变当前脚本工作目录:相当 ...

  2. 中文分词实战——基于jieba动态加载字典和调整词频的电子病历分词

    分词是自然语言处理中最基本的一个任务,这篇小文章不介绍相关的理论,而是介绍一个电子病历分词的小实践. 开源的分词工具中,我用过的有jieba.hnlp和stanfordnlp,感觉jieba无论安装和 ...

  3. EscapeAndUnescapeUtil【java模拟js的escape和unescape函数】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 在这里做一个记录,基本代码同参考资料<java模拟js的escape和unescape函数>一样. 效果图     代码 ...

  4. springboot~@Query到DTO对象

    我们有时在进行开发过程中,使用jpa的@Query注解去选择多张表然后返回一个DTO对象,这个时候我们需要特殊处理一下,因为默认情况下,你的jpa代码是不认DTO对象的. 参考文章:https://s ...

  5. 当代前端应该怎么写这个hello world?

    前言 大概16年的时候我们队react进行了简单的学习:从DOM操作看Vue&React的前端组件化,顺带补齐React的demo,当时我们只是站在框架角度在学习,随着近几年前端的变化,想写个 ...

  6. SAMBA服务和FTP服务讲解(week3_day1)--技术流ken

    samba服务 Smb主要作为网络通信协议; Smb是基于cs架构: 完成Linux与windows之间的共享:linux与linux之间共享用NFS 第一步:安装samba [root@ken ~] ...

  7. Writing a Simple Service and Client (C++)

    此前说的publisher/subscriber都是广播式的,subscriber被动地接收消息,二者没有request/response这种交互. Service Node Client Node ...

  8. Java 项目中一种简单的动态修改配置即时生效的方式 WatchService

    这种方式仅适合于比较小的项目,例如只有一两台服务器,而且配置文件是可以直接修改的.例如 Spring mvc 以 war 包的形式部署,可以直接修改resources 中的配置文件.如果是 Sprin ...

  9. 【开源分享】微信营销系统(第三方微信平台)github 开源

    升讯威微信营销系统(微信第三方平台) 在线体验:http://wxcm.eeipo.cn/开源地址GitHub:https://github.com/iccb1013/Sheng.WeixinCons ...

  10. Error fetching https://gems.ruby-china.org/: bad response Not Found 404 (https://gems.ruby-china.org/specs.4.8.gz) 报错解决办法

    执行换源操作 gem source -a https://gems.ruby-china.org/ 时报错: Error fetching https://gems.ruby-china.org/: ...