我使用本教程在我的应用中实现了暗模式:
https://developer.school/flutter-dynamic-theming-with-provider/
一切正常,但我对单个容器有一点问题。
我为它指定了一个特定的颜色。
return Container(
width: double.infinity,
padding: EdgeInsets.symmetric(
vertical: 32.0,
horizontal: 24.0,
),
margin: EdgeInsets.only(
bottom: 20.0,
),
decoration: BoxDecoration(
color: Color(0xFFD3D3D3),
borderRadius: BorderRadius.circular(20.0),
),
现在我需要根据我当前的主题更改容器的颜色。
感谢您的帮助。
答案 0 :(得分:0)
最好的做法是使用 bool 值从暗模式切换到亮模式
那么你可以这样做。
import 'package:flutter/material.dart';
class ThemeChanger with ChangeNotifier {
bool isDark == false;
void changeTheme() {
isDark = !isDark;
notifyListeners();
}
}
然后这样称呼它
class MaterialAppWithTheme extends StatelessWidget {
@override
Widget build(BuildContext context) {
final theme = Provider.of<ThemeChanger>(context);
return MaterialApp(
home: HomePage(),
theme: theme.isDark == false ? ThemeData.light() : ThemeData.dark(),
);
}
}
更改容器样式
class MaterialAppWithTheme extends StatelessWidget {
@override
Widget build(BuildContext context) {
final theme = Provider.of<ThemeChanger>(context);
return Container(
width: double.infinity,
padding: EdgeInsets.symmetric(
vertical: 32.0,
horizontal: 24.0,
),
margin: EdgeInsets.only(
bottom: 20.0,
),
decoration: BoxDecoration(
color: theme.isDark == false ? Color(0xFFD3D3D3) : Colors.black,
borderRadius: BorderRadius.circular(20.0),
),
);
}
}
答案 1 :(得分:0)
decoration: BoxDecoration(
color: Theme.of(context).brightness == Brightness.light ? Color(0xFFD3D3D3) : Colors.red,
borderRadius: BorderRadius.circular(20.0),
),