Rendering of TeX equation is stuck

[flutternoob]

After upgrading the package, all the equations are not getting rendered in the release version of the app. They were rendering before the upgrade. Most equations render, while for others, the progress indicator is shown and rendering does not take place, whether there are few or many equations. I was also wondering what is the maximum number of equations you recommend that should be in a given screen. Thanks.

[shah-xad]

What do you mean by all equations?? How many TeXViews are you using in a single view?? Have you added required permissions in Manifest?

[flutternoob]

All equations means that all the equations in a single view are not rendering, Most do, but others do not. I have 10 equations in one of the views. Two do not render, while the other 8 render. In another view, I have 4 equations. Two render, while the other two do not. In yet another view, where I have 4 equations, all of them render. This is why I asked how many equations would you recommend to have in a single view. Yes, I have added the required permissions in the Android Manifest.

I also cleared the app's cache (on the device), uninstalled and reinstalled the app, but the problem persists.

[shah-xad]

Can you share your code?? So I can reproduce your issue for debugging.

[Sahejmaharjan1]

I'm also having kinda similar problem, sometimes it renders sometimes throws error

code:
import 'package:flutter/material.dart';
import 'package:flutter_tex/flutter_tex.dart';

class QuestionWidget extends StatelessWidget {
final String questionText;
QuestionWidget(this.questionText);

@OverRide
Widget build(BuildContext context) {
print(questionText);
return Container(
width: double.infinity,
padding: EdgeInsets.only(top: 40.0),
margin: EdgeInsets.all(10),
child:
//
Card(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: TeXView(
renderingEngine: RenderingEngine.MathJax,
teXHTML: questionText,
loadingWidget: Center(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [
CircularProgressIndicator(),
Text("loading")
],
),
),
),
),
),
);
}
}

[shah-xad]

@Sahejmaharjan1 Did you try this??

[Sahejmaharjan1]

yes i did @shah-xad.... can we render the whole string of list at first and display the rendered list without loading?

[flutternoob]

@shah-xad Ive attached the code and related assets as a zip file. Sorry if the code is noobish
for_debugging.zip
.

[shah-xad]

@flutternoob I just checked your code, and I found that you are using so many TeXView in a single Page which is not recommended as TeXView is based on webview_flutter, which is a heavy widget.
Don't use separate TeXView for a single equation, Just put all those in a single TeXView and style them with custom CSS and HTML like

String textHTML = r"""
<style>
 #myDiv 
 {
 background-color: red;
 }
</style>

<div id='myDiv'>
    $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
</div>
"""

You should have basic HTML and CSS knowledge to accomplish this.

[shah-xad]

@Sahejmaharjan1 I think your issue is related to hot reloading on TeXView page, just use hot restart. It's not our issue it's related to flutter.

[flutternoob]

@shah-xad OK, thanks. I am curious though, was webview the only way to implement the flutter_tex library? Or did you find any other way to implement the library, but found Webview better?

[shah-xad]

@shah-xad I am so sorry but currently we haven't any other choice because Katex and MathJax both are Javascript libraries and it's not possible to use them without webview. Although I am working on this to render multiple views. Soon I'll release a new version.

[shah-xad]

I tried to improve the flutter_tex and updated it to 3.5.0 version please check it and be careful there are API changes please do check the example before proceeding.

[flutternoob]

@shah-xad Thank you for the update. I will look into it.

[shah-xad]

have you solved your issue?

[shah-xad]

I am closing this, If you still have an issue you can create a new issue.