IOS 使用CoreText实现表情文本URL等混合显示控件

实现了一个富文本视图控件。主要针对表情图片，文本字符，URL，等这种类型的文本进行显示。

源码地址 https://github.com/TinyQ/TQRichTextView 实现的效果如下图。

　　　　

控件展示完毕　　　

---------------------------------------------------------------------------------------------------

这里先介绍下我写这个控件的项目目录结构和功能。从下面这个目录结构截图说起。

　

1.EmojiLmage 　　　　　　文件夹存放的是表情图片资源。

2.TQRichTextBaseRun 　　这个是特殊文本元素的抽象对象。这里定义了需要子类实现方法和属性。URLRun，ImageRun 等都是从这个继承。

3.TQRichTextURLRun 　　 这个是用来支持URL文本类型的文本元素对象。

4.TQRichTextImageRun　 这个是图片类型的文本元素对象。比如表情文本其实是要绘制图片到文本中间。后面的EmojiRun就是派生自这个对象。

5.TQRichTextEmojiRun     这个是表情文本元素对象，用来识别表情字符串替换成表情图片工作。

6.TQRichTextView　　　　 文本显示所用到的视图。

这里先简要说一下这个控件的工作流程。

1.首先。肯定是我们会获得一个要现实的文本字符串。 比如是下面这样的。（举例）

“这里是面向程序员的知识分享与学习社区[呵呵][愤怒]不允许发布任何推广、广告、政治方面的https://github.com/TinyQ/TQRichTextView内容”

2.我们需要对这个字符串进行解析。以便剥离出哪些是文本，表情。url。然后文本的话就是普通显示，表情就替换成对应的图片。URL就蓝色高亮显示。

我们解析出来的就是这样的。按照下面的顺序。

　　“这里是面向程序员的知识分享与学习社区

　　TQRichTextEmojiRun(呵呵) 　　标记位置是 Rect（18，4）

　　TQRichTextEmojiRun(愤怒)　　 标记位置是 Rect（22，4）

　　不允许发布任何推广、广告、政治方面的

　　TQRichTextURLRun                 标记位置是 Rect（xx，xx） 我就不数数查了。囧

　　内容”

3.绘制。其实CoreText的绘制方式是这样的。它可以将文本全部给CoreText，然后它会给你绘制好。包括换行等。你只需要在表情的地方流出空白，然后在绘制上图片

就可以了，（但其实这个控件里面换行也是自己计算的。因为发现会有行间距不一致的bug，表情在行为换行不对的bug等。用coretext自动绘制的话）。

在这个项目里。简单根据代码说下具体实现

//-- 解析文本内容
- (NSString *)analyzeText:(NSString *)string
{
    [self.richTextRunsArray removeAllObjects];
    [self.richTextRunRectDic removeAllObjects];
    NSString *result = @"";
    NSMutableArray *array = self.richTextRunsArray;
    result = [TQRichTextEmojiRun analyzeText:string runsArray:&array];
    result = [TQRichTextURLRun analyzeText:result runsArray:&array];
    [self.richTextRunsArray makeObjectsPerformSelector:@selector(setOriginalFont:) withObject:self.font];
    return result;
}

得到文本后，我们对文本进行解析。具体解析算法呢，都是写在对应的RichTextxxxRun中的。

比如表情解析就是在TQRichTextEmojiRun 中。url同理。在解析的过程中，比如解析表情。

匹配到了表情，就生成一个TQRichTextEmojiRun 对象，这个对象记录了这个表情文本的位置。

原始字符等信息。把根据生成的对象放入richTextRunsArray这么一个数组中。用于文字渲染完后根据

这个对象渲染表情图片。因为都是继承baseRun来的。所以，解析出来的不管是表情，还是url什么，都会

统一执行渲染方法。

当我们解析完，得到了特殊文本的run数组对象。我们就绘制文本。然后填补表情等。这些就是在 drawRect

这个方法里面执行的了。我就不贴了。比较长。也比较多。

这里在说明下BaseRun 里面抽象的2个方法

//-- 替换基础文本
- (void)replaceTextWithAttributedString:(NSMutableAttributedString*) attributedString
{
    [attributedString addAttribute:@"TQRichTextAttribute" value:self range:self.range];
}

//-- 绘制内容
- (BOOL)drawRunWithRect:(CGRect)rect
{
    return NO;
}

1.replaceTextWithAttributedString 这个方法，是用来替换文本的。说是替换，其实有2中情况。

如果文本单元是一个表情的话。我需要将原先的字符串用一个空格代替 ，然后预留出画表情的位置。绘制表情图片在图层

在比如文本单元是一个URL的话。其实这里没有替换以前的URL，只是设置了属性字符串。在URL这一段，让他蓝色显示。

2.drawRunWithRect

这个方法是绘制文本单元。和上面类似。如果表情文本单元，这个就要负责回事图片到图层。如果是URL，这个方法直接返回

NO 就好了。告诉绘制的时候。这个方法什么都没有做。（这跟后面做触摸响应时间时候。获得正确的点击区域判断有关系。）

这里我举个例子。比如你用这个控件。你说你不仅仅要实现URL，表情，你要加一个@XXX 要可以点击。也要绿色显示。

那你就可以继承TQRichTextBaseRun 实现一个TQRichTextAtRun。实现这2个方法。可以参照URLRun。然后在加入解析@xxx

这种类型字符串的方法。那么@就得到了支持。具体细节。看源码吧。