使用flutter_tex时背景为黑色，无法设置为白色该如何解决？

问题原因 #

flutter_tex 4.0.3版本底层依赖WebView实现TeX内容渲染，存在纯白色色值解析的已知bug：当你将背景色设置为Colors.white（对应十六进制色值#FFFFFF）时，WebView默认的暗色适配逻辑会覆盖你传入的配置，其他非纯白色的色值不受影响所以可以正常生效。

可行解决方法 #

下面两种方案任选其一即可： #

方案1：使用接近纯白的色值替代 #

这是成本最低的修复方式，直接将Colors.white替换为接近纯白的色值，避开版本bug即可：

class Maths extends StatelessWidget {
  const Maths({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return TeXView(
      child: const TeXViewDocument(
        r"""
          When \(a \ne 0 \), there are two solutions to \(ax^2 + bx + c = 0\) and they are
          $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$""",
        style: TeXViewStyle(
          backgroundColor: Color(0xFFFEFEFE), // 替换为接近纯白的色值
          contentColor: Colors.blue,
        ),
      ),
      style: const TeXViewStyle(
        backgroundColor: Color(0xFFFEFEFE), // 替换为接近纯白的色值
      ),
    );
  }
}

方案2：强制覆盖WebView内部CSS样式 #

如果需要使用完全纯白的背景，可以通过自定义CSS强制覆盖WebView的默认样式：

class Maths extends StatelessWidget {
  const Maths({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return TeXView(
      child: TeXViewDocument(
        r"""
          When \(a \ne 0 \), there are two solutions to \(ax^2 + bx + c = 0\) and they are
          $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$""",
        style: TeXViewStyle(
          backgroundColor: Colors.white,
          contentColor: Colors.blue,
          css: "body {background-color: #ffffff !important;}", // 强制覆盖body背景
        ),
      ),
      style: const TeXViewStyle(
        backgroundColor: Colors.white,
      ),
    );
  }
}

内容的提问来源于stack exchange，提问作者ThomasG2201