赞
踩
概述
针对富文本来说,一直都是移动端的痛。虽然网上的解决方案很多,但是大多数都是基于展示,真正可以进行编辑的,却很少。而这些少数的实现中,适合我使用就没有了。
所以我决定自己研究,并实现。
需求
需求说起来很简单,就是要设计一款IOS、Androd、PC端通用的富文本编辑器。模仿新浪微博中-头条文章。
调研
经过多次的分析和调研,有过这么几套方案。
使用UIWebView来实现
使用内嵌js编辑器实现
使用html解析后,原生控件实现
使用Markdown语法实现
使用第三方富文本库来实现
基于TextKit,自己写套富文本编辑器
分析
1、使用UIWebView来实现
实现原理:
在显示的html文件中加入 contenteditable = "true"
可使UIWebView支持编辑。
如:
或
优点:
实现起来很简单,功能简单,而且与服务端的数据传输,只需要获得html的内容即可。
缺点:
操作、体验、功能、性能都是非常不爽的,依赖于网络,无法扩展更多的功能。而且UIWebView也是非常消耗性能的,就算换成UIWkWebview虽然能好些,但是一样不推荐使用。
结论:
只适合进行页面展示,和简单的编辑。
2、使用内嵌js编辑器实现
实现原理:
把一套js富文本编辑器,放到app中,在打开编辑器的时候,调用本地的资源进行加载。
优点:
实现简单,功能强大,加载速度快,而且与服务端的数据传输,只需要获得html的内容即可,还可以实现本地图片的显示(不用先把图片上传到服务端),就算没有网,也可以编写。
缺点:
需要根据机型来进行兼容性测试、编辑器更新比较麻烦,部分操作不太流畅,体验一般,扩张性不强。
结论:
如果对交互和体验的要求不高,推荐使用。
3. 使用html解析后,原生控件实现
实现原理:
获取html文本,进行解析后,转换成NSMutableAttributedString,加载到对应的原生控件中;编辑完成后,再转成html文本,传给服务器。
优点:
交互和体验很好,因为使用原生控件,性能消耗不多,操作可以自定义,较为方便。
缺点:
需要IOS、Android分别做开发,而且开发难度很大,主要问题就是解析html 和 转换成html,虽然也有一些第三方库来辅助,但是效果不是很理想。
结论:
技术难度大,不推荐使用。
4. 使用Markdown语法实现
实现原理:
传输Markdown格式的字符串,IOS、Android客户端进行解析展示,修改完,在把Markdown格式的字符串,传给服务器。需要都支持Markdown的解析
优点:
比较流行,传输内容少,速度快,可以实时预览。有第三方的类库,开发相对简单些。
缺点:
有一定的学习成本,还没有完全普及,扩展新功能很难。
结论:
主要看使用者年龄段,如果面向年轻人,推荐使用。
5. 使用第三方富文本库来实现
实现原理:
网上有一些基于CoreText来实现的第三方库,但是交互需要自定义标签,才能进行。
优点:
功能强,操作简单,交互好,集成方便。
缺点:
IOS、Android都需要独立开发,还需要与服务端有一套自定义的标签。如果想自定义一些功能,需要修改底层,比较麻烦。
结论:
推荐使用,不过自定义难度较大。
6.基于TextKit,自己写套富文本编辑器
最后一种方式,会在下一个章节介绍,除了功能,还有代码,及服务端交互的数据结构等。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。