UiTextView添加标签时部分Emoji显示异常问题排查

最近在给应用做标签功能，标签文本发送到服务器时格式是"{{@23235}}"，这部分功能跑起来都正常。但遇到个头疼的问题：在消息里@用户添加标签时，部分Emoji会出现显示异常——刚插入标签的时候Emoji显示好好的，可一旦按下空格、输入@或者其他字符，这些Emoji就变样了，而且只有特定类型的Emoji（比如带肤色修饰、组合式的Emoji）会出这问题。

我一开始试着用String的decodeEmoji扩展方法来修复，结果完全没用，相关代码贴在下面：

相关代码片段 #

Emoji解码扩展

var decodeEmoji: String{
 guard let data = self.data(using: String.Encoding.utf8) else {return self}
 let decodedStr = NSString(data: data, encoding: String.Encoding.nonLossyASCII.rawValue)
 if let str = decodedStr{
 return str as String
 }
 return self
 }

插入标签的核心方法

public func insertTag(_ tag: Taggable, atRange range: NSRange){
 let currentFullText = NSMutableAttributedString(attributedString: self.attributedText)
 let tagText = tag.visual.decodeEmoji
 let tagRange = NSRange(location: range.location, length: tagText.count)
 self.tags = self.updateTags(self.tags, whenUpdatingText: currentFullText.string, inRange: range, withText: tagText)
 let attributes = self.tagAttributes + [NSAttributedStringKey.link: "\(tag.url)"]
 let tagStr = NSAttributedString(string: tagText, attributes: attributes)
 currentFullText.replaceCharacters(in: range, with: tagStr)
 self.tags.append(Tag(element: tag, range: tagRange))
 self.attributedText = currentFullText
 self.selectedRange = NSRange(location: tagRange.upperBound, length: 0)
 }

Taggable协议定义

protocol Taggable {
 var value: String { get }
 var visual: String { get }
 var url: URL { get }
 }

问题解决办法 #

折腾了好一阵后终于找到根源了！问题出在NSMutableParagraphStyle上——当给包含复杂Emoji（比如带肤色、组合型的Emoji）的富文本应用这个段落样式时，会干扰Emoji的字符布局，导致后续输入字符时显示异常。

解决思路很简单：要么避免给包含这类特殊Emoji的文本段落直接应用NSMutableParagraphStyle，要么调整段落样式的设置逻辑，确保Emoji的渲染不受影响。比如可以检查文本内容中是否存在这类复杂Emoji，针对性地跳过段落样式的应用；或者换一种方式设置段落属性，不影响Emoji的字符排版。

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