search

tneotia / html-editor-enhanced

A Flutter package that provides a WYSIWYG editor backed by flutter_inappwebview and the Summernote library.
https://pub.dev/packages/html_editor_enhanced
MIT License
275 stars 337 forks source link

How to fix on navigation to back page having screen flickering issue #522

Open AlicyberMeteors opened 4 months ago

AlicyberMeteors commented 4 months ago

Type question here. When navigate to previous sceen for a moment screen flickers

this is my code HtmlEditor( otherOptions: OtherOptions( decoration: BoxDecoration(border: Border.all(color: const Color(0xffA8AEBF)),borderRadius: BorderRadius.circular(15))), controller: htmlEditorController, callbacks: Callbacks( onChangeContent: (text) { setState(() { htmlDescription=text!; debugPrint("debug text $htmlDescription"); debugPrint("HtmlEditor content changed"); }); }, ), htmlEditorOptions: HtmlEditorOptions( adjustHeightForKeyboard: true, autoAdjustHeight: true, initialText: htmlDescription, hint: 'Your text here...', shouldEnsureVisible: false,

                ),
                htmlToolbarOptions: const HtmlToolbarOptions(
                  toolbarPosition: ToolbarPosition.aboveEditor, //by default
                  defaultToolbarButtons: [
                    FontButtons(bold: true,clearAll: false,subscript: false,strikethrough: false,superscript: false),
                    FontSettingButtons(fontSizeUnit: false,fontName: false,),
                    ColorButtons(),
                    ListButtons(listStyles: false),
                    ParagraphButtons(textDirection: false, lineHeight: false, caseConverter: false,decreaseIndent: false,increaseIndent: false,),
                  ],
                  toolbarType: ToolbarType.nativeScrollable, //by default
                ),

              ),

and having this error AndroidInAppWebViewWidget calling "dispose" using [] D/ConnectivityManager(23317): StackLog: [android.net.ConnectivityManager.unregisterNetworkCallback(ConnectivityManager.java:5075)] [org.chromium.net.a.h(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:17)] [WV.P7.a(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:3)] [org.chromium.android_webview.AwContentsLifecycleNotifier.onLastWebViewDestroyed(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:22)] [J.N.MQGusfGb(Native Method)] [WV.s6.run(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:3)] [WV.kd.handleMessage(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:55)] [WV.md.a(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:25)] [org.chromium.android_webview.AwContents.k(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:33)] [WV.c6.run(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:20)] D/ConnectivityManager(23317): StackLog: [android.net.ConnectivityManager.unregisterNetworkCallback(ConnectivityManager.java:5075)] [org.chromium.net.a.h(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:26)] [WV.P7.a(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:3)] [org.chromium.android_webview.AwContentsLifecycleNotifier.onLastWebViewDestroyed(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:22)] [J.N.MQGusfGb(Native Method)] [WV.s6.run(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:3)] [WV.kd.handleMessage(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:55)] [WV.md.a(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:25)] [org.chromium.android_webview.AwContents.k(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:33)] [WV.c6.run(chromium-TrichromeWebViewGoogle6432.aab-stable-647813433:20)] E/chromium(23317): [ERROR:aw_browser_terminator.cc(166)] Renderer process (9514) crash detected (code -1).

amabilee commented 1 week ago

The flickering issue when navigating back might be due to the HtmlEditor's disposal process or screen rendering when it reloads. I cant say for sure whats the problem, but you can check these:

  1. Check the dispose Method: Make sure the htmlEditorController is properly disposed when the widget is removed.
  2. Avoid Frequent setState Calls: Calling setState on every onChangeContent can be resource-intensive and could contribute to flickering, especially if the editor is frequently updating
  3. Cache the Editor State: To avoid reloading the editor from scratch when navigating back, you could use a PageStorageKey to store the editor’s state.
  4. If you’re using InAppWebView or something similar under the hood, setting cacheMode: WebSettings.LOAD_CACHE_ELSE_NETWORK in the WebView might help reduce flickering.