我刚接触Flutter和bloc。我正在使用bloc状态管理制作一个可以根据系统主题更改主题的应用程序。现在它运行良好,但我需要一个可以覆盖主题的开关。我是通过观看YouTube教程来制作这个应用程序的。 有没有办法创建一个可以更改主题的开关。
主题Cubit
class ThemeCubit extends Cubit<ThemeState> {
ThemeCubit() : super(ThemeState(themeMode: ThemeMode.light)) {
updateAppTheme();
}
void updateAppTheme() {
final Brightness currentBrightness = AppTheme.currentSystemBrightness;
currentBrightness == Brightness.light
? _setTheme(ThemeMode.light)
: _setTheme(ThemeMode.dark);
}
void _setTheme(ThemeMode themeMode) {
AppTheme.setStatusBarAndNavigationBarColor(themeMode);
emit(ThemeState(themeMode: themeMode));
}
}
主题状态
class ThemeState {
final ThemeMode themeMode;
ThemeState({@required this.themeMode});
}
这是 main.dart 的代码
void main() {
Bloc.observer = AppBlocObserver();
runApp(DevicePreview(
builder: (context) => App(),
enabled: false,
plugins: [
const ScreenshotPlugin(),
],
));
}
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MultiBlocProvider(
providers: [
BlocProvider<ThemeCubit>(
create: (context) => ThemeCubit(),
),
],
child: MchatsApp(),
);
}
}
class MchatsApp extends StatefulWidget {
const MchatsApp({
Key key,
}) : super(key: key);
@override
_MchatsAppState createState() => _MchatsAppState();
}
class _MchatsAppState extends State<MchatsApp> with WidgetsBindingObserver {
@override
void initState() {
WidgetsBinding.instance.addObserver(this);
super.initState();
}
@override
void dispose() {
WidgetsBinding.instance.removeObserver(this);
super.dispose();
}
@override
void didChangePlatformBrightness() {
context.read<ThemeCubit>().updateAppTheme();
super.didChangePlatformBrightness();
}
@override
Widget build(BuildContext context) {
return LayoutBuilder(
builder: (context, constraints) {
return OrientationBuilder(
builder: (context, orientation) {
SizerUtil().init(constraints, orientation);
return MaterialApp(
locale: DevicePreview.locale(context),
builder: DevicePreview.appBuilder,
title: Strings.appTitle,
theme: AppTheme.lightTheme,
darkTheme: AppTheme.darkTheme,
themeMode: context.select(
(ThemeCubit themeCubit) => themeCubit.state.themeMode),
debugShowCheckedModeBanner: false,
initialRoute: AppRouter.root,
onGenerateRoute: AppRouter.onGenerateRoute,
);
},
);
},
);
}
}