之前的项目中有发布富文本帖子的需求,而受限于屏幕大小等原因,移动设备上的富文本编辑功能一直是个难题。这个系列的文章会介绍和讨论当时开发过程中遇到的问题以及解决方案,希望能给大家日后的开发带来一些帮助。
我自己开发的富文本控件也上传到了github,点此下载:github
首先,一个富文本编辑器最基本功能需要包括:图文混排、字体加粗等样式、插入链接、插入表情等方法。如果接触过安卓富文本编辑的相关知识,会知道安卓平台提供了一套基于Span的富文本控件,来完成在EditText中的样式排布。包括图片(ImageSpan),不同的文字样式(StyleSpan),url样式(UrlSpan)等都有对应的类型。比如下面这段代码就是添加了一个url链接在文本的start和end之间:
SpannableString spannable = new SpannableString(url);
URLSpan =new URLSpan(url);
spannable.setSpan(span,start,end,Spanned.SPAN_EXCLUSIVE_INCLUSIVE);
要理解上述这段代码,首先介绍一下安卓中的span这个概念。在TextView和EditText中,显示的是文本,而span是“附着”在相应文本上的对象。在绘制时,展示的是这些“附着”的对象而不是文本本身。这可以类比成一个cosplay,其实还是一段段的文本,但是不同文本戴上了不同的面具,化了不同的装扮,展示出了不同的效果。
Span元素的继承结构是:SpannableString -> Spannable -> Spanned -> CharSequence。后面三个都是接口,SpannableString是最终的实现类。
对应上述代码,我们先构造的SpannableString是挂载了富文本对象的字符串,在TextView上显示的是挂在的对象,而不是文本本身。
下面分析一下setSpan这个方法:
public void setSpan(Object what, int start, int end, int flags);
最后一个参数flags的含义是这种富文本在其之前或之后添加文本时是否需要将同样的样式应用于其上。
经常使用的flag有:
- Spanned.SPAN_EXCLUSIVE_EXCLUSIVE(前后都不包括)
- Spanned.SPAN_INCLUSIVE_EXCLUSIVE(前面包括,后面不包括)
- Spanned.SPAN_EXCLUSIVE_INCLUSIVE(前面不包括,后面包括)
- Spanned.SPAN_INCLUSIVE_INCLUSIVE(前后都包括)
一般来说,ImageSpan都采取的是SPAN_EXCLUSIVE_EXCLUSIVE,而url会采用Spanned.SPAN_EXCLUSIVE_INCLUSIVE。
以上就是一个SpannableString的最基本用法,看起来还是挺简单的。但是现实是骨感的,在现实开发中,会遇到很多的问题,后续会慢慢介绍。
最后还是欢迎大家下载我的源码对照文章阅读。
Android富文本编辑器(二):图文混排以及图片上传处理
Android富文本编辑器(三):文字样式
Android富文本编辑器(四):HTML文本转换