Flutter Math is a plugin that uses Dart and Flutter rendering LaTeX mathematical formulas entirely, and can be seen as a KaTeX port on Dart and Flutter platforms. LaTeX supports roughly the same syntax as KaTeX (see the Github repository for a few syntax not currently supported in the current version), and renders mathematical formulas almost pixel-like KaTeX.

Compared with the existing flutter_tex plug-in, this plugin is completely based on Dart and Flutter, without any WebView or Javascript, and has much better performance than Flutter_tex. If you frequently encounter stutter and crashes caused by Flutter_tex, please try Flutter Math.

Render the sample

x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}

i\hbar\frac{\partial}{\partial t}\Psi(\vec x,t) = -\frac{\hbar}{2m}\nabla^2\Psi(\vec x,t)+ V(\vec x)\Psi(\vec x,t)

\hat f(\xi) = \int_{-\infty}^\infty f(x)e^{- 2\pi i \xi x}\mathrm{d}x

Method of use

  1. Add a dependency on Flutter_math in the pubspec.yaml file
  2. Add the following font resources to the flutter: TAB of pubspec.yaml 
    flutter:

  // .

  fonts:
    - family: KaTeX_Main
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Main-Regular.ttf
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Main-Italic.ttf
          style: italic
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Main-Bold.ttf
          weight: 700
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Main-BoldItalic.ttf
          weight: 700
          style: italic
    - family: KaTeX_Math
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Math-Italic.ttf
          style: italic
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Math-BoldItalic.ttf
          weight: 700
          style: italic
    - family: KaTeX_AMS
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_AMS-Regular.ttf
    - family: KaTeX_Caligraphic
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Caligraphic-Regular.ttf
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Caligraphic-Bold.ttf
          weight: 700
    - family: KaTeX_Fraktur
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Fraktur-Regular.ttf
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Fraktur-Bold.ttf
          weight: 700
    - family: KaTeX_SansSerif
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_SansSerif-Regular.ttf
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_SansSerif-Bold.ttf
          weight: 700
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_SansSerif-Italic.ttf
          style: italic
    - family: KaTeX_Script
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Script-Regular.ttf
    - family: KaTeX_Typewriter
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Typewriter-Regular.ttf
    - family: KaTeX_Size1
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Size1-Regular.ttf
    - family: KaTeX_Size2
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Size2-Regular.ttf
    - family: KaTeX_Size3
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Size3-Regular.ttf
    - family: KaTeX_Size4
      fonts:
        - asset: packages/flutter_math/katex_fonts/fonts/KaTeX_Size4-Regular.ttf
Copy the code
  3. In the code using FlutterMath. FromTexString (expression) component rendering results. You can provide optional parameters options to control the render style, baseSizeMultiplier to control the size, and onErrorFallback to customize how to display error messages when entering errors. A sample of 
    FlutterMath.fromTexString(
  r'\frac a b',
  options: Options.displayOptions,
  baseSizeMultiplier: 1.0
  onErrorFallback: (errMsg) => Text(errMsg),
)
Copy the code

Project repository address: GitHub address. The current version is 0.1.1. Please refer to GitHub for more information and unsupported KaTeX features. Welcome to star, welcome to fork!