Как правильно реализовать математические уравнения во флаттере, используя Flutter TeX, который содержит порт mathjax для флаттера - PullRequest
2 голосов
/ 27 апреля 2020

Я пытался реализовать математические уравнения в приложении флаттера, используя пакет TeX флаттера. Это займет много времени, чтобы сделать уравнение. Это не выглядит так хорошо, как я хотел. Существуют ли другие реализации для эффективного использования математической химии и других сложных форматных уравнений без ущерба для дизайна.

вот мой код:

import 'package:flutter/material.dart';
import 'package:flutter_tex/flutter_tex.dart';
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget{

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      backgroundColor: Colors.grey,
      body:TeXView(
          teXHTML: r"""
  <style>
   #myDiv 
   {
    color:   "#CC0000",

   }
  </style>

  <div id='myDiv'>
      $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
  </div>
  """ ,
          renderingEngine: RenderingEngine.Katex,  // Katex for fast render and MathJax for quality render.
          onRenderFinished: (height) {
                print("Widget Height is : $height");
                },   
          onPageFinished: (string) {
                print("Page Loading finished");
              },
        )
    );
  }}

вот вывод:

enter image description here

1 Ответ

1 голос
/ 05 мая 2020

Просто взгляните на последнюю версию flutter_tex: ^ 3.5.0 + 2 , добавлена ​​функция стилевого оформления, теперь вы можете легко и просто стилизовать все и все. В этой версии есть некоторые изменения API, поэтому, пожалуйста, будьте осторожны перед обновлением и проверьте пример перед продолжением.

Что касается скорости рендеринга, вам следует изменить движок рендеринга с Mathjax на Katex, который намного быстрее, чем Mathjax. например, renderingEngine:RenderingEngine.Katex

...