日期: 2023 年 2 月 8 日

前言

一个优秀的富文本，应该包含优秀的排版算法、丰富的功能和渲染的高性能。在上一篇中，我们实现了可扩展的、基础的富文本编辑器。那么在本文中，让我们对富文本进行更多功能的扩展。

注：

— 为了在阅读本文时有更好的体验，请先阅读本专栏第一篇，前文涉及到的知识点，本文不再赘述。（摸鱼的朋友请忽略）

— 完整代码太多， 文章只分析核心代码，需要源码请到 代码仓库

文本与图片混排

在有关富文本的业务需求中，或其他文章渲染中，图文混排的功能是十分重要的。在Flutter中，为了解决这个图文混排的问题，有一个很方便的组件：WidgetSpan。而在本专栏的第一篇的文本基础知识中，已经分析了TextSpan在文本渲染过程中的作用。那么WidgetSpan是如何被渲染的呢，Flutter又是如何将TextSpan与WidgetSpan混合渲染在一起的呢？

—— 效果图完整代码在仓库demo/image_text

继续阅读Flutter如何将文本与图片混合编辑？（功能扩展篇）

前言

在上一章中，我们分析了一个富文本编辑器需要有哪些模块组成。在本文中，让我们从零开始，去实现自定义的富文本编辑器。

注：本文篇幅较长，从失败的方案开始分析再到成功实现自定义富文本编辑器，真正的从0到1。建议收藏！

— 完整代码太多， 文章只分析核心代码，需要源码请到 代码仓库，也可在本站下载代码拷贝。

错误示范

遭一蹶者得一便，经一事者长一智。——宋·无名氏《五代汉史平话·汉史》

在刚开始实现富文本时，为了更快速的实现富文本的功能，我利用了TextField这个组件，但写着写着发现TextField有着很大的局限性。不过错误示范也给我带来了一些启发，那么现在就让我和大家一起去探索富文本编辑器的世界吧。

继续阅读Flutter从0到1实现高性能、多功能的富文本编辑器（基础实战篇）