【iOS开发】在UILabel中同时显示图片和文字,"混排"。

一、 用户场景：

实现微信、QQ的聊天对话框中，文字和表情同时存在功能，即图文混排。

二、思路描述：

(1) 使用富文本方法

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

(2)代码实现：

    // 创建UILabel控件    UILabel *lab = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 300, 60)];    lab.center = self.view.center;    lab.backgroundColor = [UIColor orangeColor];    // 1.创建一个富文本    NSMutableAttributedString *attri =  [[NSMutableAttributedString alloc] initWithString:@"嘿嘿嘿嘿嘿123456789"];    // 修改富文本中的不同文字的样式    [attri addAttribute:NSForegroundColorAttributeName value:[UIColor blueColor] range:NSMakeRange(0, 5)];    [attri addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:20] range:NSMakeRange(0, 5)];    // 设置数字为红色    [attri addAttribute:NSForegroundColorAttributeName value:[UIColor redColor] range:NSMakeRange(5, 9)];    [attri addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:30] range:NSMakeRange(5, 9)];    // 2.添加表情图片    NSTextAttachment *attch = [[NSTextAttachment alloc] init];    // 表情图片    attch.image = [UIImage imageNamed:@"023[困]@2x.png"];    // 设置图片大小    attch.bounds = CGRectMake(0, 0, 32, 32);    // 创建带有图片的富文本    NSAttributedString *string = [NSAttributedString attributedStringWithAttachment:attch];    [attri insertAttributedString:string atIndex:3];// 插入某个位置    // 用label的attributedText属性来使用富文本    lab.attributedText = attri;    [self.view addSubview:lab];

三、 效果图：

Demo下载地址：Demo_AttributedLable