颤振中的HTML所见即所得编辑器？

Posted 2023-03-22

【中文标题】颤振中的HTML所见即所得编辑器？

【英文标题】：Html wysiwyg editor in flutter?

【发布时间】：2020-12-04 06:06:37

【问题描述】：

有没有办法在 Flutter 文本字段编辑器中使用 Summernote 或所见即所得的编辑器？

我使用了 flutter_html_editor、Zefyr、html_editor 和 flutter_summernote 包，但这些包效果不佳，它们在以下代码中返回 null 值：

    final _etEditor = await keyEditor.currentState.getText();

我收到以下错误：

E/flutter ( 6639): [ERROR:flutter/lib/ui/ui_dart_state.cc(166)] Unhandled Exception: NoSuchMethodError: The method 'getText' was called on null.
E/flutter ( 6639): Receiver: null
E/flutter ( 6639): Tried calling: getText()

我希望文本字段变得像附加的图像。如何解决？

我可以实现这样的包吗，或者有什么解决方案可以制作可以在 Flutter 中转换 html 标签的 Summernote 或所见即所得的文本字段编辑器？

谢谢

【问题讨论】：

您能否提供a minimal, complete and verifiable example 以便我们检查您收到错误的部分？另外，您能否验证this SO post 是否可以帮助您？

【参考方案1】：

使用flutter_summernote

getText() 总是抛出错误，但我有一个解决方法

GlobalKey < FlutterSummernoteState > _keyEditor = GlobalKey();
String globalText = "";

FlutterSummernote(
  //showBottomToolbar: _keyboardVisible,
  hasAttachment: true,
  value: globalText,
  hint: globalText == null ? "Your text here..." : "",
  key: _keyEditor,
  returnContent: (_) 
    print("text from return Context $_");
    globalText = _;
  ),

【参考方案2】：

您可以尝试我的包html_editor_enhanced，它没有getText() 错误，并使用具有大量自定义功能的完全本机控件。它看起来像这样：

【讨论】：

我同时使用flutter_html和html_editor时遇到问题。 image_picker: ^0.6.4 flutter_html: ^2.0.0 html_editor: ^1.0.1 因为每个版本的html_editor都依赖于webview_flutter ^0.3.21，flutter_html 2.0.0依赖于webview_flutter ^2.0.4，所以html_editor和flutter_html 2.0不兼容。 0。并且由于没有任何版本的flutter_html 匹配>2.0.0

不要使用 html_editor，使用 html_editor_enhanced: ^2.1.1 :)