增加主题功能

This commit is contained in:
jyuesong
2022-01-21 17:30:25 +08:00
parent 5c6f016ab6
commit b8b195b663
11 changed files with 162 additions and 153 deletions

View File

@@ -7,17 +7,21 @@ import 'package:qinglong_app/utils/codeeditor_theme.dart';
import 'package:qinglong_app/utils/sp_utils.dart'; import 'package:qinglong_app/utils/sp_utils.dart';
var themeProvider = ChangeNotifierProvider((ref) => ThemeViewModel()); var themeProvider = ChangeNotifierProvider((ref) => ThemeViewModel());
const Color _primaryColor = Color(0xFF299343); Color _primaryColor = const Color(0xFF299343);
get primaryColor => _primaryColor;
class ThemeViewModel extends ChangeNotifier { class ThemeViewModel extends ChangeNotifier {
ThemeData currentTheme = lightTheme; late ThemeData darkTheme;
late ThemeData lightTheme;
late ThemeData currentTheme;
bool _isInDarkMode = false; bool _isInDarkMode = false;
Color primaryColor = const Color(0xFF299343);
ThemeColors themeColor = LightThemeColors(); ThemeColors themeColor = LightThemeColors();
ThemeViewModel() { ThemeViewModel() {
darkTheme = getDartTheme();
lightTheme = getLightTheme();
var brightness = SchedulerBinding.instance!.window.platformBrightness; var brightness = SchedulerBinding.instance!.window.platformBrightness;
_isInDarkMode = brightness == Brightness.dark; _isInDarkMode = brightness == Brightness.dark;
changeThemeReal(_isInDarkMode, false); changeThemeReal(_isInDarkMode, false);
@@ -47,9 +51,87 @@ class ThemeViewModel extends ChangeNotifier {
void changeTheme() { void changeTheme() {
changeThemeReal(!SpUtil.getBool(spTheme, defValue: false), true); changeThemeReal(!SpUtil.getBool(spTheme, defValue: false), true);
} }
}
ThemeData darkTheme = ThemeData.dark().copyWith( ThemeData getLightTheme() {
return ThemeData.light().copyWith(
brightness: Brightness.light,
primaryColor: _primaryColor,
colorScheme: ColorScheme.light(
secondary: _primaryColor,
primary: _primaryColor,
),
scaffoldBackgroundColor: const Color(0xfff5f5f5),
inputDecorationTheme: InputDecorationTheme(
labelStyle: TextStyle(color: _primaryColor),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: _primaryColor,
),
),
border: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0xff999999),
),
),
enabledBorder: const UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0xff999999),
),
),
),
appBarTheme: AppBarTheme(
backgroundColor: _primaryColor,
titleTextStyle: const TextStyle(
color: Colors.white,
fontSize: 18,
),
),
bottomNavigationBarTheme: BottomNavigationBarThemeData(
selectedItemColor: _primaryColor,
),
buttonTheme: ButtonThemeData(
buttonColor: _primaryColor,
),
progressIndicatorTheme: ProgressIndicatorThemeData(
color: _primaryColor,
),
tabBarTheme: TabBarTheme(
labelStyle: const TextStyle(
fontSize: 14,
),
unselectedLabelStyle: const TextStyle(
fontSize: 14,
),
labelColor: _primaryColor,
unselectedLabelColor: const Color(0xff999999),
indicator: UnderlineTabIndicator(
borderSide: BorderSide(color: _primaryColor),
),
),
toggleableActiveColor: _primaryColor,
checkboxTheme: CheckboxThemeData(
checkColor: MaterialStateProperty.resolveWith(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return Colors.transparent;
}
if (states.contains(MaterialState.selected)) {
return Colors.white;
}
return Colors.black;
},
),
),
cupertinoOverrideTheme: NoDefaultCupertinoThemeData(
brightness: Brightness.light,
primaryColor: _primaryColor,
scaffoldBackgroundColor: const Color(0xfff5f5f5),
),
);
}
ThemeData getDartTheme() {
return ThemeData.dark().copyWith(
brightness: Brightness.dark, brightness: Brightness.dark,
primaryColor: const Color(0xffffffff), primaryColor: const Color(0xffffffff),
scaffoldBackgroundColor: Colors.black, scaffoldBackgroundColor: Colors.black,
@@ -60,19 +142,19 @@ ThemeData darkTheme = ThemeData.dark().copyWith(
fontSize: 18, fontSize: 18,
), ),
), ),
inputDecorationTheme: const InputDecorationTheme( inputDecorationTheme: InputDecorationTheme(
labelStyle: TextStyle(color: _primaryColor), labelStyle: TextStyle(color: _primaryColor),
focusedBorder: UnderlineInputBorder( focusedBorder: UnderlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: _primaryColor, color: _primaryColor,
), ),
), ),
border: UnderlineInputBorder( border: const UnderlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: Color(0xff999999), color: Color(0xff999999),
), ),
), ),
enabledBorder: UnderlineInputBorder( enabledBorder: const UnderlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: Color(0xff999999), color: Color(0xff999999),
), ),
@@ -88,7 +170,7 @@ ThemeData darkTheme = ThemeData.dark().copyWith(
labelColor: Color(0xffffffff), labelColor: Color(0xffffffff),
unselectedLabelColor: Color(0xff999999), unselectedLabelColor: Color(0xff999999),
), ),
colorScheme: const ColorScheme.light( colorScheme: ColorScheme.light(
secondary: _primaryColor, secondary: _primaryColor,
primary: _primaryColor, primary: _primaryColor,
), ),
@@ -111,82 +193,9 @@ ThemeData darkTheme = ThemeData.dark().copyWith(
primaryColor: Color(0xffffffff), primaryColor: Color(0xffffffff),
scaffoldBackgroundColor: Colors.black, scaffoldBackgroundColor: Colors.black,
), ),
); );
ThemeData lightTheme = ThemeData.light().copyWith(
brightness: Brightness.light,
primaryColor: _primaryColor,
colorScheme: const ColorScheme.light(
secondary: _primaryColor,
primary: _primaryColor,
),
scaffoldBackgroundColor: const Color(0xfff5f5f5),
inputDecorationTheme: const InputDecorationTheme(
labelStyle: TextStyle(color: _primaryColor),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: _primaryColor,
),
),
border: UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0xff999999),
),
),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: Color(0xff999999),
),
),
),
appBarTheme: const AppBarTheme(
backgroundColor: _primaryColor,
titleTextStyle: TextStyle(
color: Colors.white,
fontSize: 18,
),
),
bottomNavigationBarTheme: const BottomNavigationBarThemeData(
selectedItemColor: _primaryColor,
),
buttonTheme: const ButtonThemeData(
buttonColor: _primaryColor,
),
progressIndicatorTheme: const ProgressIndicatorThemeData(
color: _primaryColor,
),
tabBarTheme: const TabBarTheme(
labelStyle: TextStyle(
fontSize: 14,
),
unselectedLabelStyle: TextStyle(
fontSize: 14,
),
labelColor: _primaryColor,
unselectedLabelColor: Color(0xff999999),
indicator: UnderlineTabIndicator(
borderSide: BorderSide(color: _primaryColor),
),
),
toggleableActiveColor: _primaryColor,
checkboxTheme: CheckboxThemeData(
checkColor: MaterialStateProperty.resolveWith(
(Set<MaterialState> states) {
if (states.contains(MaterialState.disabled)) {
return Colors.transparent;
} }
if (states.contains(MaterialState.selected)) { }
return Colors.white;
}
return Colors.black;
},
),
),
cupertinoOverrideTheme: const NoDefaultCupertinoThemeData(
brightness: Brightness.light,
primaryColor: _primaryColor,
scaffoldBackgroundColor: Color(0xfff5f5f5),
),
);
abstract class ThemeColors { abstract class ThemeColors {
Color settingBgColor(); Color settingBgColor();

View File

@@ -249,7 +249,7 @@ class _TaskDetailPageState extends ConsumerState<EnvDetailPage> {
child: Text( child: Text(
"确定", "确定",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
), ),
), ),
onPressed: () async { onPressed: () async {

View File

@@ -238,11 +238,11 @@ class EnvItemCell extends StatelessWidget {
), ),
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5), borderRadius: BorderRadius.circular(5),
border: Border.all(color: primaryColor, width: 1), border: Border.all(color: ref.watch(themeProvider).primaryColor, width: 1),
), ),
child: Text( child: Text(
"$index", "$index",
style: TextStyle(color: primaryColor, fontSize: 12), style: TextStyle(color: ref.watch(themeProvider).primaryColor, fontSize: 12),
), ),
), ),
const SizedBox( const SizedBox(
@@ -332,7 +332,7 @@ class EnvItemCell extends StatelessWidget {
child: Text( child: Text(
"确定", "确定",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
), ),
), ),
onPressed: () { onPressed: () {

View File

@@ -115,7 +115,7 @@ class _LoginPageState extends ConsumerState<LoginPage> {
if (debugBtnIsShow()) { if (debugBtnIsShow()) {
dismissDebugBtn(); dismissDebugBtn();
} else { } else {
showDebugBtn(context, btnColor: primaryColor); showDebugBtn(context, btnColor: ref.watch(themeProvider).primaryColor);
} }
WidgetsBinding.instance?.endOfFrame; WidgetsBinding.instance?.endOfFrame;
}, },
@@ -327,7 +327,7 @@ class _LoginPageState extends ConsumerState<LoginPage> {
padding: const EdgeInsets.symmetric( padding: const EdgeInsets.symmetric(
vertical: 5, vertical: 5,
), ),
color: canClickLoginBtn() ? primaryColor : primaryColor.withOpacity(0.4), color: canClickLoginBtn() ? ref.watch(themeProvider).primaryColor : ref.watch(themeProvider).primaryColor.withOpacity(0.4),
child: isLoading child: isLoading
? const CupertinoActivityIndicator() ? const CupertinoActivityIndicator()
: const Text( : const Text(
@@ -476,7 +476,7 @@ class _LoginPageState extends ConsumerState<LoginPage> {
child: Text( child: Text(
"确定", "确定",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
), ),
), ),
onPressed: () async { onPressed: () async {

View File

@@ -91,7 +91,7 @@ class _AboutPageState extends ConsumerState<AboutPage> {
child: Text( child: Text(
"Telegram频道", "Telegram频道",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
fontSize: 16, fontSize: 16,
), ),
), ),
@@ -107,7 +107,7 @@ class _AboutPageState extends ConsumerState<AboutPage> {
child: Text( child: Text(
"版本更新", "版本更新",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
fontSize: 16, fontSize: 16,
), ),
), ),
@@ -122,7 +122,7 @@ class _AboutPageState extends ConsumerState<AboutPage> {
child: Text( child: Text(
"项目地址", "项目地址",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
fontSize: 16, fontSize: 16,
), ),
), ),

View File

@@ -231,7 +231,7 @@ class DependencyCell extends ConsumerWidget {
bean.status == 1 bean.status == 1
? Icon( ? Icon(
CupertinoIcons.checkmark_circle, CupertinoIcons.checkmark_circle,
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
size: 16, size: 16,
) )
: (bean.status == 2 : (bean.status == 2
@@ -348,7 +348,7 @@ class DependencyCell extends ConsumerWidget {
child: Text( child: Text(
"确定", "确定",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
), ),
), ),
onPressed: () { onPressed: () {

View File

@@ -86,7 +86,7 @@ class _LoginLogPageState extends ConsumerState<LoginLogPage> with LazyLoadState<
trailing: item.status == 0 trailing: item.status == 0
? Icon( ? Icon(
CupertinoIcons.checkmark_circle, CupertinoIcons.checkmark_circle,
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
size: 16, size: 16,
) )
: const Icon( : const Icon(

View File

@@ -357,7 +357,7 @@ class _OtherPageState extends ConsumerState<OtherPage> {
child: Text( child: Text(
"确定", "确定",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
), ),
), ),
onPressed: () { onPressed: () {

View File

@@ -98,7 +98,7 @@ class _ScriptDetailPageState extends ConsumerState<ScriptDetailPage> with LazyLo
child: Text( child: Text(
"确定", "确定",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
), ),
), ),
onPressed: () async { onPressed: () async {

View File

@@ -385,7 +385,7 @@ class _TaskDetailPageState extends ConsumerState<TaskDetailPage> {
child: Text( child: Text(
"确定", "确定",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
), ),
), ),
onPressed: () async { onPressed: () async {

View File

@@ -447,7 +447,7 @@ class TaskItemCell extends StatelessWidget {
child: Text( child: Text(
"确定", "确定",
style: TextStyle( style: TextStyle(
color: primaryColor, color: ref.watch(themeProvider).primaryColor,
), ),
), ),
onPressed: () { onPressed: () {