如何在Flutter中实现编辑器？可用哪些组件，TextField是否适用？

系统自带TextField的适用性说明 #

原生TextField并非完全不适用于代码编辑场景，但仅适合极轻量的需求：

• 如果你的需求只是处理百行以内的代码片段，自定义TextEditingController将输入文本解析为带语法高亮样式的TextSpan，再搭配自定义的侧边栏行号组件，也能实现基础的编辑效果
• 如果要做支持数千行以上文本、带代码补全、括号匹配、代码折叠等专业功能的编辑器，直接用TextField会面临非常高的开发成本，且大文本下输入、滚动的性能问题很难自行优化，不推荐使用

可落地的代码编辑器实现方案 #

• 基于底层EditableText组件二次开发
  EditableText是TextField的底层父组件，暴露了更多文本渲染、输入事件处理的自定义钩子，你可以基于它自行实现语法高亮解析、行号渲染、懒加载、编辑辅助逻辑，性能比直接改造TextField好很多，适合有定制化需求的场景
• 直接使用社区成熟的第三方代码编辑器组件
  Flutter社区已经有封装完善的代码编辑器组件，内置了语法高亮、行号显示、自动缩进、括号匹配、大文本优化等基础能力，支持自定义语法规则、主题配色，常规代码编辑需求基本可以开箱即用，不需要从底层自研
• 内嵌Web端成熟代码编辑器
  如果需要实现专业级IDE能力、对接语言服务器协议(LSP)这类复杂需求，可以通过Flutter WebView组件内嵌成熟的Web端代码编辑器，这种方案能力上限最高，缺点是需要额外适配Web和Flutter原生层的交互，内存占用相对更高

内容的提问来源于stack exchange，提问作者luckrill