iOS 比较简单富文本自定义Enmoji表情

好久没有写简书了, 最近公司的App比较多功能需要开发(其实是比较懒), 所以就没有写. 现在想一下时候该好好总结一下项目中的问题并且和大家分享一下!
近期App的直播上有一个聊天室的功能需要优化和修改(之前的UI巨丑, 留下的坑...), 在疯狂的调整UI并把界面弄得还算OK后, 突然发现, 发送的消息里为什么会出现【滑稽】【鲜花】这样的信息出现呢?
如图:


屏幕快照 2017-12-03 下午9.05.07.png

原来是SDK中的表情没有做配对, 于是想到了YYText这个控件, 这篇文章是别人如何学习YYText的(自己比较懒借用一下)http://www.jianshu.com/p/dbc3c4a8f8a2
看完文章后一开始的思路: 用富文本 NSTextAttachment 这个类来实现, 先用正则 NSRegularExpression 来匹配出【】之间的字符串然后进行替换

  [AttributedString replaceCharactersInRange:match.range withAttributedString:string];

但是这样替换是有问题的, 如果只有一个表情还可以, 但是如果是多个表情就会出现崩溃, 可能是替换了一个表情之后原来的字符串的长度会发生改变导致原来匹配出来的range不一样了.

仔细想了一想, 其实可以将字符串切成几块然后再替换成表情, 最后再拼接起来如:

// 消息: 你好啊!【鲜花】哈哈
//分解后: 1.你好啊!      2【鲜花】 3. 哈哈
  • 拆解字符串的方法(没有用正则, 发现了一个更简单的方法(正则太蛋疼了)):
//获取字符串数组
- (void)getMessageRange:(NSString*)message :(NSMutableArray*)array {
    
    NSRange range=[message rangeOfString: @"【"];
    
    NSRange range1=[message rangeOfString: @"】"];
    
    //判断当前字符串是否还有表情的标志。
    
    if (range.length>0 && range1.length>0) {
        
        if (range.location > 0) {
            
            [array addObject:[message substringToIndex:range.location]];
            
            [array addObject:[message substringWithRange:NSMakeRange(range.location, range1.location+1-range.location)]];
            
            NSString *str=[message substringFromIndex:range1.location+1];
            
            [self getMessageRange:str :array];
            
        }else {
            
            NSString *nextstr=[message substringWithRange:NSMakeRange(range.location, range1.location+1-range.location)];

            //排除文字是“”的
            if (![nextstr isEqualToString:@""]) {
                
                [array addObject:nextstr];
                
                NSString *str=[message substringFromIndex:range1.location+1];
                
                [self getMessageRange:str :array];
                
            }else {
                return;   
            }   
        }
    } else if (message != nil) {
        [array addObject:message];   
    }
}
  • 替换(先判断是不是表情)
//获取NSMutableAttributedString
- (NSMutableAttributedString *)getEnmojiAttributedStringWithString:(NSString *)string{
    NSMutableArray *contentArray = [NSMutableArray array];
    [self getMessageRange:string :contentArray];
    NSMutableAttributedString *strM = [[NSMutableAttributedString alloc] init];
    for (NSString *object in contentArray) {
        //   是不是表情
        if ([object hasSuffix:@"】"]&&[object hasPrefix:@"【"]){
            NSTextAttachment *imageAtt = [[NSTextAttachment alloc]init];
        //表情包资源
            NSString *path = [[NSBundle mainBundle]pathForResource:@"PlayerSDK" ofType:@"bundle"];
            NSString *imageTest = [NSString stringWithFormat:@"%@.gif",[object substringWithRange:NSMakeRange(1, object.length - 2)]];
            imageAtt.image = [UIImage imageWithContentsOfFile:[NSString stringWithFormat:@"%@/%@",path,imageTest]];
            //-2调整位置
            imageAtt.bounds = CGRectMake(0, -2, self.contentLab.font.lineHeight,self.contentLab.font.lineHeight);
            NSAttributedString *attrString = [NSAttributedString attributedStringWithAttachment:imageAtt];
            [strM appendAttributedString:attrString];
            
        }else{
            //如果不是表情直接进行拼接
            
            [strM appendAttributedString:[[NSAttributedString alloc] initWithString:object]];
            
        }
    }
    return strM;
} 
  • 最后效果图完成:


    屏幕快照 2017-12-03 下午9.02.06.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 总想写点什么,用不知道从什么写起,那就想起什么写什么吧(是不是太随便了*_*)。本文讲述如何使用NSRegular...
    蔡胜波阅读 9,577评论 0 5
  • 转自: JS正则表达式一条龙讲解,从原理和语法到JS正则、ES6正则扩展,最后再到正则实践思路 温馨提示:文章很长...
    前端渣渣阅读 5,792评论 1 32
  • iOS中使用正则表达式就不得不提NSRegularExpression,所以我们需要先搞清楚什么是NSRegula...
    sunmumu1222阅读 6,942评论 0 4
  • 画了一个鸡蛋,以前上学的时候学过水分,闲了好多年了,现在用固体水彩画,却不知道该怎么画了,特别是湿画法,鸡蛋的整体...
    偷时间的人儿阅读 1,651评论 0 2
  • 像病了一样,心情总是时好时坏。也只有画画能让我暂时忘掉这糟糕的生活。不该传递负能量的,还是要坚强乐观。
    雨葭子阅读 1,898评论 7 5