Customizable Flutter plugin that renders TeX equations blazingly fast!

Fluttex is a customizable Flutter plugin that renders TeX equations blazingly fast.

### Built With

This project provides an efficient Widget that renders TeX equations using KaTeX. Fluttex is built on TeX Tools, a TeX library for Android that uses WebViews as a wrapper for KaTeX. As such, it would not have been possible without the great work put into the KaTeX typesetting library for the web.

## Getting Started

### Installation

Refer to the installation guide on pub.dev

### Usage

Add the widget MathViewStatic to your build method. Take a look at the configuration section to see which parameters you can pass.

var MathView = new MathViewStatic(
tex: "\\int_{-\\infty}^\\infty \\hat f(\\xi)\\,e^{2 \\pi i \\xi x} \\,d\\xi \\\\",
);

The above is an example of a MathView that only has the tex parameter. Make note that all backslashes have to be escaped.

It is also possible to change the TeX parameter programmatically later on. Create a MathViewStatic as usual and add the onMathViewCreated callback.

var MathView = new MathViewStatic(
onMathViewCreated: (controller) {
_mathViewController = controller;
},
);

Later on, you can use the MathViewController to render new TeX strings.

_mathViewController.render("\\ce{\$K = \\frac{[\ce{Hg^2+}][\\ce{Hg}]}{[\\ce{Hg2^2+}]}\$}");

For more detailed overview of the example, please refer to the example directory.

## Configuration

#### MathView

You can change the following properties of the MathView.

KeyDescriptionTypeDefault
texA string of TeX that should be renderedStringnull
displayMode"If true the math will be rendered in display mode, which will put the math in display style (so \int and \sum are large, for example), and will center the math on the page on its own line. If false the math will be rendered in inline mode."booleanfalse
leqno"If true, display math has \tags rendered on the left instead of the right, like \usepackage[leqno]{amsmath} in LaTeX."booleanfalse
fleqno"If true, display math renders flush left, like \documentclass[fleqn] in LaTeX."booleanfalse
throwOnError"If true (the default), KaTeX will throw a ParseError when it encounters an unsupported command or invalid LaTeX. If false, KaTeX will render unsupported commands as text, and render invalid LaTeX as its source code with hover text giving the error, in the color given by errorColor."booleanfalse
colorThe color of the TeX rendered in the MathView.Colorblack
colorBackgroundThe background color of the MathView.Colorwhite
colorErrorA color that determines the color that unsupported commands and invalid LaTeX are rendered in when throwOnError is set to false.Color#c00
fontSizeThe font size of the rendered TeX string.Integer16

Descriptions are partially quoted from the KaTeX Docs.

Here's a list of additions that are planned for the future:

1. Support for iOS
2. Support for Flutter Web
3. Interactive MathView
4. MathInput, that checks the TeX input for correctness and offers typing support

See the open issues for a list of proposed features (and known issues).

## Contributing

Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

## Contact

If you have any questions, feel free to contact Leon Staufer.