我正在实现一个主题黑暗与光明。
如果我用这个
title: Text("${singleProject.name}",),style: Theme.of(context).textTheme.headline5),
即使我切换到黑暗,文本仍然是黑色的。
如果我用这个密码
title: Text("${singleProject.name}",),
文本正在改变他的颜色取决于我是在亮或暗模式。问题是在这种情况下,我不能使用字体和大小,我想为我所有的应用程序。
拜托,你能帮忙吗?
文本主题
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
class TTextTheme {
static TextTheme lightTextTheme = TextTheme(
subtitle1: GoogleFonts.openSans (color: Colors.black,
fontWeight: FontWeight.bold,fontSize: 13.0),
///For subtitle Drawer Menu
bodyText1: GoogleFonts.montserrat (color: Colors.black,
fontWeight: FontWeight.normal,fontSize: 16.0),
bodyText2: GoogleFonts.montserrat (color: Colors.black,
fontWeight: FontWeight.bold,fontSize: 13.0),
headline6: const TextStyle(fontSize: 30),
///For AppBar title
headline1: GoogleFonts.openSans(color: Colors.white,
fontWeight: FontWeight.bold, fontSize: 16.0),
///For Title Drawer Menu
headline2: GoogleFonts.openSans(color: Colors.blue[900],
fontWeight: FontWeight.bold, fontSize: 13.0),
///For tasks & Projects lists
headline3: GoogleFonts.montserrat (color: Colors.black,
fontWeight: FontWeight.normal,fontSize: 16.0,),
/* headline4: GoogleFonts.montserrat (color: Colors.black,
fontWeight: FontWeight.normal,fontSize: 16.0,
decoration: TextDecoration.lineThrough,
decorationThickness: 2.85,
fontStyle: FontStyle.italic),
*/
headline5: GoogleFonts.montserrat (color: Colors.black,
fontWeight: FontWeight.normal,fontSize: 16.0,),
);
static TextTheme darkTextTheme = TextTheme(
subtitle1: GoogleFonts.openSans (color: Colors.white,
fontWeight: FontWeight.bold,fontSize: 13.0),
///For subtitle Drawer Menu
bodyText1: GoogleFonts.montserrat (color: Colors.white,
fontWeight: FontWeight.normal,fontSize: 16.0),
bodyText2: GoogleFonts.montserrat (color: Colors.white,
fontWeight: FontWeight.bold,fontSize: 13.0),
headline6: const TextStyle(fontSize: 30),
///For AppBar title
headline1: GoogleFonts.openSans(color: Colors.white,
fontWeight: FontWeight.bold, fontSize: 16.0),
///For Title Drawer Menu
headline2: GoogleFonts.openSans(color: Colors.blue[900],
fontWeight: FontWeight.bold, fontSize: 13.0),
///For tasks & Projects lists
headline3: GoogleFonts.montserrat (color: Colors.white,
fontWeight: FontWeight.normal,fontSize: 16.0,),
headline4: GoogleFonts.montserrat (color: Colors.white,
fontWeight: FontWeight.normal,fontSize: 16.0,
decoration: TextDecoration.lineThrough,
decorationThickness: 2.85,
fontStyle: FontStyle.italic),
headline5: GoogleFonts.montserrat (color: Colors.white,
fontWeight: FontWeight.normal,fontSize: 16.0,),
);
}
主题_提供者
import 'package:flutter/material.dart';
import 'package:my_gtd_20220804/theme/text_theme.dart';
class ThemeProvider extends ChangeNotifier {
ThemeMode themeMode = ThemeMode.system;
bool get isDarkMode => themeMode == ThemeMode.dark;
void toggleTheme (bool isOn){
themeMode = isOn? ThemeMode.dark : ThemeMode.light ;
notifyListeners();
}
}
class MyThemes {
static final darkTheme = ThemeData(
primarySwatch: Colors.grey,
primaryColor: Colors.white,
brightness: Brightness.dark,
dividerColor: Colors.grey[300],
scaffoldBackgroundColor: Colors.black,
colorScheme: const ColorScheme.dark(),
iconTheme: const IconThemeData(color: Colors.white),
textTheme: TTextTheme.darkTextTheme,
backgroundColor: Colors.black,
bottomAppBarColor: Colors.black,
// fontFamily: 'arimo',
);
static final lightTheme = ThemeData(
primarySwatch: Colors.blue,
primaryColor: Colors.black,
brightness: Brightness.light,
dividerColor: Colors.grey[300],
scaffoldBackgroundColor: Colors.white,
iconTheme: const IconThemeData(color: Colors.white),
textTheme: TTextTheme.lightTextTheme,
// fontFamily: 'arimo',
backgroundColor: Colors.white,
bottomAppBarColor: Colors.white,
// accentColor: Colors.red,
// accentIconTheme: IconThemeData(color: Colors.white),
// colorScheme: const ColorScheme.light(),
// primaryColor: Colors.blue,
);
/*final menuTitleText = const TextTheme(
subtitle2: 10,
);
*/
}
主要
return MaterialApp(
themeMode: themeProvider.themeMode,
theme: MyThemes.lightTheme,
darkTheme: MyThemes.darkTheme,
1条答案
按热度按时间dba5bblo1#
发生这种情况是因为您完全是自己实现
TextTheme
的,这会导致您手动指定每个属性以获得预期的结果,而不是指定ThemeData()
,考虑使用预定义的ThemeData
工厂构造函数,如ThemeData.light()
,ThemeData.dark()
,然后用copyWith
覆盖它们的属性,如下所示:可以使用
ThemeData.light().copyWith(/*...*/)
对灯光模式执行相同的操作