在深色模式下，如何指定背景颜色和文本颜色之间的对比度

Question

这是Flutter中Container中有Text的情况。

Container(
child:Text('test'),
)

在此处指定Container的背景色。

Container(
color:Colors.blue[100],
child:Text('test'),
)

灯光模式下的默认文本颜色为黑色，Container的背景色为Colors.blue[100]所以，我要说的是，这是一个设计，没有任何问题的时候，光的主题。

但是，当我切换到深色模式时，文本颜色会变为白色。由于指定的背景颜色仍然是Colors.blue[100]，背景颜色和文本颜色之间的对比度不清楚，文本变得非常难以阅读。

我想到的第一件事是

Container(
color:Theme.of(context).brightness == Brightness.light ? Colors.blue[100] : Colors.blue,
child:Text('test'),
)

如果你这样做，背景颜色将是Colors.blue在深色模式下，所以阅读起来不会很困难。

因此，这是解决方案，但在这种情况下，如上所述，每次在暗模式下手动指定背景颜色感觉是多余的。

我想知道是否有更聪明的方法将其作为一个框架，但有什么吗？我想到的是，是否有一种(更聪明的(方法可以使用Theme和ThemeData在整个应用程序中以统一的方式解决这些问题。

Answer 1

您可以通过这种方式将其直接分配给主题数据，然后它将始终保持不变。

ThemeData _buildDarkTheme() {
final base = ThemeData.dark();
return base.copywith(
---other theme stuff---
textTheme: base.textTheme.apply(
fontFamily: 'Assistant',
displayColor: ColorThemes.dark.primaryFont),
}