iOS UILabel中图文混排

最近做项目领导提出一个奇葩需求，需要在活动商品名前添加一个活动的标识，如下图

要做到图中在文字中插入图片的效果，首先我们得来了解一下一个叫富文本的东西。所谓富文本，我的理解就是一个丰富多彩的文本，多彩体现在可以在一个text中显示出不同的文字，加入一些色彩丰富的图片，但它能做到的还可以修改不同文字的字体加入下划线，丰富多采。

我们都知道label有text这个文本属性，要做到富文本效果，就需要用到一个并不是所有人都知道的富文本属性 attributedText（textView、textField中都有这个属性）

1.修改文字的样式

步骤如下：

• NSMutableAttributedString 创建一个富文本对象
• 调用富文本的对象方法 addAttribute:(NSString * )value:(id) range:(NSRange) 来修改对应range范围中 attribute属性的 value值

NSMutableAttributedString *attri = [[NSMutableAttributedString alloc] initWithString:@"绿音富平柿饼500g独立包装抽真空霜降柿子饼"];
    
    [attri addAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:14 ],NSForegroundColorAttributeName:JKCOLORBLACK} range:NSMakeRange(0, name.length)];

2.文字中添加图片

步骤如下：

• 创建NSTextAttachment的对象，用来装在图片
• 将NSTextAttachment对象的image属性设置为想要使用的图片
• 设置NSTextAttachment对象bounds大小，也就是要显示的图片的大小

• 用[NSAttributedString attributedStringWithAttachment:attch]方法，将图片添加到富文本上

// 添加表情
        NSTextAttachment *attch = [[NSTextAttachment alloc] init];
        
        // 表情图片
        switch ([_model.active[@"activeType"] intValue]) {
            case 1://助力活动
                attch.image = [UIImage imageNamed:@"activity_icon"];
                break;
                
            default:
                attch.image = [UIImage imageNamed:@"activity_icon1"];
                break;
        }
        // 设置图片大小
        attch.bounds = CGRectMake(0, 0, 60, 17);
        
        // 创建带有图片的富文本
        NSAttributedString *string = [NSAttributedString attributedStringWithAttachment:attch];
        [attri insertAttributedString:string atIndex:0];

君凯商联网-iOS-字唐名僧