如何检查背景颜色的亮度来决定上面写的文字颜色

Question

我有一个简单的问题，但找不到答案。请注意，我几乎是一个完全的初学者。

所以我有一个应用程序（不是我的，但我正在为它做贡献），里面有彩色背景的文字，可以由用户更改。如果背景足够亮，文字应该显示为黑色，如果背景不够亮，则显示为白色。

该应用程序是一款面向中小学生的学校日记应用程序，它连接到匈牙利全国范围内的学校日记服务。在这里，最好的音符是5，最差的是1。用户可以在设置中设置每个等级的颜色。目前，只有音符“4”的代码被硬编码为黑色文本（因为“4”音符的背景默认为黄色），其他所有音符均为白色。这就是我想要自动化的。

Example of white text

Example of black text

This is the main screen of the app for reference

Page where user can change color for a kind of note

现在的代码：

switch (evaluation.NumberValue) {
    case 1:
      bColor = globals.color1;
      fColor = Colors.white;
      break;
    case 2:
      bColor = globals.color2;
      fColor = Colors.white;
      break;
    case 3:
      bColor = globals.color3;
      fColor = Colors.white;
      break;
    case 4:
      bColor = globals.color4;
      fColor = Colors.black; //This should be white if color4 is dark enough. Same applies to all of them.
      break;
    case 5: //I'm looking for something like this:
      bColor = globals.color5;
      fColor = (lightLevel(globals.color5) > 50) ? Colors.black : Colors.white;
      break;
    default:
      bColor = Colors.black;
      fColor = Colors.white;
      break;
  }

我正在寻找这样的东西：

 case 5: //I'm looking for something like this:
  bColor = globals.color5;
  fColor = (lightLevel(globals.color5) > 50) ? Colors.black : Colors.white;
  break;

感谢您的帮助！

Answer 1

我可以建议 2 个选项：

ThemeData.estimateBrightnessForColor 方法例如

Color calculateTextColor(Color background) {
  return ThemeData.estimateBrightnessForColor(background) == Brightness.light ? Colors.black : Colors.white;
}

Color.computeLuminance 方法例如

Color calculateTextColor(Color background) {
  return background.computeLuminance() >= 0.5 ? Colors.black : Colors.white;
}

请记住，两者都是 computationally expensive to calculate。前者在引擎盖下使用后者。区别在于如何计算明暗阈值。

Answer 2

Brightness.estimateBrightnessForColor method e.g.
Color calculateTextColor(Color background) {
  return Brightness.estimateBrightnessForColor(background) == Brightness.light ? Colors.black : Colors.white;
}

我发现方法 estimateBrightnessForColor 现在是 class ThemeData 的一部分，所以现在需要这样调用：

ThemeData.estimateBrightnessForColor(background)

如何检查背景颜色的亮度来决定上面写的文字颜色

How to check brightness of a background color to decide text color written on it

flutter

colors

background

brightness

luminance