flutter_tex如何使用

我在Flutter项目中需要使用flutter_tex来渲染数学公式，但不太清楚具体的使用方法。请问应该如何正确集成和配置flutter_tex？能否提供一个简单的使用示例，包括如何加载LaTeX代码和设置样式？另外，flutter_tex是否支持所有常见的数学公式和符号？

2 回复

Flutter TeX 用于在 Flutter 应用中渲染数学公式（LaTeX格式）。使用方法如下：

  1. 添加依赖：在 pubspec.yaml 中添加 flutter_tex。
  2. 导入包：import 'package:flutter_tex/flutter_tex.dart';
  3. 使用 TeXView 组件，传入 LaTeX 代码字符串，例如：
    TeXView(
  child: TeXViewDocument(r"$$x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}$$"),
)
  4. 可配置样式与交互。

更多关于flutter_tex如何使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


FlutterTeX 是一个用于在 Flutter 应用中渲染 LaTeX 数学公式的库。以下是基本使用方法：

  1. 添加依赖 在 pubspec.yaml 中添加：
dependencies:
  flutter_tex: ^版本号
  1. 基本使用
import 'package:flutter_tex/flutter_tex.dart';

TeXView(
  teXHTML: r"""
    <p>行内公式：\(x = \frac{-b \pm \sqrt{b^2-4ac}}{2a}\)</p>
    <p>独立公式：$$ \int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi} $$</p>
  """,
)
  1. 完整示例
TeXView(
  renderingEngine: TeXViewRenderingEngine.katex(),
  child: TeXViewDocument(
    r"""<h1>FlutterTeX 示例</h1>
        <p>二次方程公式：$$ ax^2 + bx + c = 0 $$</p>
        <p>解为：$$ x = \frac{-b \pm \sqrt{b^2-4ac}}{2a} $$</p>""",
  ),
)
  1. 常用配置
  • renderingEngine: 渲染引擎（Katex/MathJax）
  • style: 自定义样式
  • loadingWidget: 加载时的组件

注意事项：

  • 公式需用 $$...$$（独立公式）或 \(...\)（行内公式）包裹
  • 支持大多数 LaTeX 数学命令
  • 可结合 TeXViewStyle 进行样式定制

适用于数学应用、教育类App等需要显示数学公式的场景。

回到顶部