使用flutter_tex渲染数学公式时无文本仅显细线及报错如何解决

解决方案 #

• 补全高度约束
  ListView为无界高度容器，TeXView依赖WebView实现渲染，无明确高度约束时会默认收缩到极小尺寸，即你看到的细线。可以用SizedBox包裹TeXView指定固定高度测试：

ListView(
  children: [
    SizedBox(
      height: 200,
      child: TeXView(
        renderingEngine: TeXViewRenderingEngine.katex(),
        child: TeXViewDocument(
          r"""<h2>\( \rm TeXViewTest\) 1 with ripple</h2>""",
        ),
      ),
    )
  ]
)

• 修正公式转义错误
  你当前的TeX代码中多了一个多余的反斜杠：\( \rm\\TeXViewTest\)，多余的转义符会导致KaTeX解析失败，修正为\( \rm TeXViewTest\)即可。
• 检查安卓端配置
  确认你的安卓项目配置满足以下要求：
  1. android/app/build.gradle中的minSdkVersion ≥ 19
  2. android/app/src/main/AndroidManifest.xml的application标签中添加属性android:usesCleartextTraffic="true"
• 切换渲染引擎测试
  可以将渲染引擎从KaTeX切换为MathJax验证是否是引擎兼容问题：
  renderingEngine: TeXViewRenderingEngine.mathjax()
• 排查模拟器兼容问题
  报错中的glUtilsParamSize: unknow param相关日志是安卓模拟器GPU渲染的已知问题，你可以将模拟器的GPU渲染模式改为软件渲染，或者直接使用真机测试规避该类模拟器bug。

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