How to create a rich text editor that returns html results in Flutter?

Issue

My goal is to create a rich text editor that returns html results. I am using the package flutter_quill. It can only return plain text using _controller.document.toPlainText() and json using _controller.document.toDelta().toJson(). I also tried html_editor_enhanced before. It has some problems. When I click the text color button and the dialog is shown, I can’t press one of the colors in the horizontal color list. The mouse is always a text mouse and I can enter text despite the dialog being displayed in front of the text field. Although the dialog is blocked, I can still write behind the text field. Also, I am using web (Chrome) to run the app. Are there any other rich text editors that can return html results or any way to return html results in flutter_quill? Appreciate if someone can advise. Thank you in advance!

Solution

I finally found a solution!

I am using the following code to return html results:

final convertedValue = jsonEncode(delta.toJson());
final markdown = deltaToMarkdown(convertedValue);
final html = markdownToHtml(markdown);

Answered By – My Car

Answer Checked By – Jay B. (FlutterFixes Admin)

Leave a Reply

Your email address will not be published. Required fields are marked *