iOS 图文混排
使用系统自带的NSAttributedString来处理,对于一般的图文混排已经足够了,但是,有一个缺点就是NSAttributedString并不支持gif动画。实际上,使用gif动画还是挺卡的。
思路:
1.通过RegexKitLite 正则,匹配出所有需要特殊处理的字符
2.由于表情图片占用一个字符,使用直接替换范围的方式,会导致后面的表情范围不对。有两种处理方案
方案一:
- 使用两个数组,分别装特殊字符(文字内容,文字范围,是否为特殊字符,是否为表情)和非特殊字符,按范围排序成一个新数组
- 循环新数组List,通过判断是否为表情和是否为特殊字符来添加appendAttributedString属性。
方案二:
通过递归的方式,每找到一个表情,先替换掉,再递归找下一个
当前,使用的是方案一,核心代码:
/**
* 普通文字 --> 属性文字
*
* @param text 普通文字
*
* @return 属性文字
*/
- (NSAttributedString *)attributedTextWithText:(NSString *)text
{
NSMutableAttributedString *attributedText = [[NSMutableAttributedString alloc] init]; // 表情的规则
NSString *emotionPattern = @"\\[[0-9a-zA-Z\\u4e00-\\u9fa5]+\\]";
// @的规则
NSString *atPattern = @"@[0-9a-zA-Z\\u4e00-\\u9fa5-_]+";
// #话题#的规则
NSString *topicPattern = @"#[0-9a-zA-Z\\u4e00-\\u9fa5]+#";
// url链接的规则
NSString *urlPattern = @"\\b(([\\w-]+://?|www[.])[^\\s()<>]+(?:\\([\\w\\d]+\\)|([^[:punct:]\\s]|/)))";
NSString *pattern = [NSString stringWithFormat:@"%@|%@|%@|%@", emotionPattern, atPattern, topicPattern, urlPattern]; // 遍历所有的特殊字符串
NSMutableArray *parts = [NSMutableArray array];
[text enumerateStringsMatchedByRegex:pattern usingBlock:^(NSInteger captureCount, NSString *const __unsafe_unretained *capturedStrings, const NSRange *capturedRanges, volatile BOOL *const stop) {
if ((*capturedRanges).length == ) return; TextPartModel *part = [[TextPartModel alloc] init];
part.special = YES;
part.text = *capturedStrings;
part.emotion = [part.text hasPrefix:@"["] && [part.text hasSuffix:@"]"];
part.range = *capturedRanges;
[parts addObject:part];
}]; // 遍历所有的非特殊字符
[text enumerateStringsSeparatedByRegex:pattern usingBlock:^(NSInteger captureCount, NSString *const __unsafe_unretained *capturedStrings, const NSRange *capturedRanges, volatile BOOL *const stop) {
if ((*capturedRanges).length == ) return; TextPartModel *part = [[TextPartModel alloc] init];
part.text = *capturedStrings;
part.range = *capturedRanges;
[parts addObject:part];
}]; // 排序
// 系统是按照从小 -> 大的顺序排列对象
[parts sortUsingComparator:^NSComparisonResult(TextPartModel *part1, TextPartModel *part2) {
// NSOrderedAscending = -1L, NSOrderedSame, NSOrderedDescending
// 返回NSOrderedSame:两个一样大
// NSOrderedAscending(升序):part2>part1
// NSOrderedDescending(降序):part1>part2
if (part1.range.location > part2.range.location) {
// part1>part2
// part1放后面, part2放前面
return NSOrderedDescending;
}
// part1<part2
// part1放前面, part2放后面
return NSOrderedAscending;
}]; UIFont *font = [UIFont systemFontOfSize:];
NSMutableArray *specials = [NSMutableArray array];
// 按顺序拼接每一段文字
for (TextPartModel *part in parts) {
// 等会需要拼接的子串
NSAttributedString *substr = nil;
if (part.isEmotion) { // 表情
NSTextAttachment *attch = [[NSTextAttachment alloc] init];
NSString *name = [EmoticonTool emoticonWithChs:part.text].png;
if (name) { // 能找到对应的图片
attch.bounds = CGRectMake(, -, font.lineHeight, font.lineHeight);
attch.image = [UIImage imageNamed:name];
substr = [NSAttributedString attributedStringWithAttachment:attch];
} else { // 表情图片不存在
substr = [[NSAttributedString alloc] initWithString:part.text];
}
} else if (part.special) { // 非表情的特殊文字
substr =[[NSAttributedString alloc] initWithString:part.text attributes:@{NSForegroundColorAttributeName : [UIColor redColor]
}];
SpecialModel *s = [[SpecialModel alloc] init];
s.text = part.text;
NSUInteger loc = attributedText.length;
NSUInteger len = part.text.length;
s.range = NSMakeRange(loc, len);
[specials addObject:s];
} else { // 非特殊文字
substr = [[NSAttributedString alloc] initWithString:part.text];
}
[attributedText appendAttributedString:substr];
} // 一定要设置字体,保证计算出来的尺寸是正确的
[attributedText addAttribute:NSFontAttributeName value:font range:NSMakeRange(, attributedText.length)];
[attributedText addAttribute:@"specials" value:specials range:NSMakeRange(, )]; return attributedText;
}
在使用过程中,我们需要注意一点,计算文本的宽高,通过下面来计算
[status.attributedText boundingRectWithSize:CGSizeMake(maxW, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin context:nil].size;
在计算过程中,我们并没有传字体大小,因而,我们需要给attributedText一开始设定字体大小:
// 一定要设置字体,保证计算出来的尺寸是正确的
[attributedText addAttribute:NSFontAttributeName value:font range:NSMakeRange(, attributedText.length)];
设置行高
// 定义行高
NSMutableParagraphStyle * paragraphStyle = [[NSMutableParagraphStyle alloc] init];
[paragraphStyle setLineSpacing:];
[attributedText addAttribute:NSParagraphStyleAttributeName value:paragraphStyle range:NSMakeRange(, attributedText.length)];
附源代码:http://pan.baidu.com/s/1o8Su8H0
目录说明:
HomeViewController ---列表
StatusCell ---列表TableCell
StatusFrame ---列表TableCell高度。由于cell的高度是不固定的,因此我们定义StatusFrame来管理所有的控件尺寸,最后返回总高度
StatusModel ---微博模型,图文混排处理,在这里做核心混排处理,通过添加attributedText属性处理。
--TextPartModel --StatusModel嵌套属性,用于记录RegexKitLite 正则匹配出的字符
--SpecialModel --StatusModel嵌套属性,用于特殊实符点击变色的范围比比较
--UserModel --StatusModel嵌套属性,用户模型
iOS 图文混排的更多相关文章
- ios图文混排
图文混排的形式 1. 富文本形式 2. core Text(文字排版) 3. TextKit 4. UIWebView 一.富文本 我们可以采用attributeString来进行图文混排.例如一个文 ...
- iOS 图文混排 链接 可点击
对于这个话题 我想到 1 第一个解决方法就是使用 webView 比较经典 把所有复杂工作都交给控件本身去处理了, 但是好像好多需要自定义的地方 没法从 webView获得响应回调 :(估计也可以实 ...
- iOS图文混排的几种方式
最近优化升级了之前做的一个项目,现在这一期已接近尾声了,今天可以腾出些时间总结一下最近项目中用的比较多的图片文字混排显示的内容.现在遇到比较多的图文混排的基本有三种:一种是在标签中显示 价格符号+价格 ...
- iOS 图文混排 (Swift版)
// 0> 图片附件 let attachment = NSTextAttachment() attachment.image = #imageLiteral(resourceName: &qu ...
- 【iOS】使用CoreText实现图文混排
iOS没有现成的支持图文混排的控件,而要用多个基础控件组合拼成图文混排这样复杂的排版,是件很苦逼的事情.对此的解决方案有使用CoreText进行绘制,或者使用TextKit.本文主要讲解对于CoreT ...
- 高性能图文混排框架,构架顺滑的iOS应用-b
About GallopGallop是一个功能强大.性能优秀的图文混排框架. Features主要用于解决以下需求: 滚动列表的性能优化.Gallop使用异步绘制.视图层级合并.观察mainRunlo ...
- ios开发--图文混排(富文本)
最近准备接一个编辑类的app,所以就查了下相关的功能,并自己试验了下: /** iOS 6之前:CoreText,纯C语言,极其蛋疼 iOS 6开始:NSAttributedString,简单易用 i ...
- IOS开发UI篇--一个支持图文混排的ActionSheet
一.简单介绍 UIActionSheet是IOS提供给我们开发人员的底部弹出菜单控件.一般用于菜单选择.操作确认.删除确认等功能.IOS官方提供的下面方式对UIActionView进行实例化: - ( ...
- iOS火焰动画效果、图文混排框架、StackView效果、偏好设置、底部手势等源码
iOS精选源码 高性能图文混排框架,构架顺滑的iOS应用. 使用OpenGLE覆盖阿尔法通道视频动画播放器视图. 可选最大日期截至当日日期的日期轮选器ChooseDatePicker 简单轻量的图片浏 ...
随机推荐
- Entity Framework DbSet<T>之Include方法与IQueryable<T>扩展方法Include的使用
Entity Framework使用Code First方式时,实体之间已经配置好关系,根据实际情况某些情况下需要同时获取导航属性,比如获取商品的同时需要获取分类属性(导航属性),或者基于优化方面考虑 ...
- hdu3374 String Problem【最小表示法】【exKMP】
String Problem Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)To ...
- WebStorm中配置node.js(Windows)
WebStorm中配置node.js(Windows) 一.node 1.下载安装包 32 位 : https://nodejs.org/dist/v4.4.3/node-v4.4.3-x86.msi ...
- 自动化运维工具-pdsh工具安装配置及简单使用讲解
1.先决条件: 安装pssh工具的主机针对远程主机需要配置免秘钥认证: ssh-keygen -t rsa ssh-copy-id [remotehost] 2.下载pssh工具安装介质: https ...
- Hadoop 2.x完全分布式安装
前期规划 192.168.100.231 db01 192.168.100.232 db02 192.168.100.233 ...
- [Day1]常用Dos命令,Java相关描述及基础
1.常用的DOS命令 (1)返回上一级目录:cd.. (2)返回盘符根目录:cd\ (3)切换当前盘符: 盘符: (4)进入文件夹: cd 文件路径 (5)展示当前目录下的所有内容:D ...
- 12.2RAC搭建记录
12.2RAC环境搭建记录 安装前资源检查 资源限制要求/etc/security/limits.conf Table 6-1 Installation Owner Resource Limit Re ...
- PLSQL分级取数据
分级取数据 select employee_id,last_name,job_id,manager_id from employees start with employee_id=101 --emp ...
- ATL Thunk机制深入分析
如果你有SDK的编程经验,就一定应该知道在创建窗口时需要指定窗口类,窗口类中的一种重要的参数就是窗口过程.任何窗口接收到的消息,都是由该窗口过程来处理. 在面向对象编程中,如果还需要开发人员来使用原始 ...
- 【Python全栈-后端开发】MySQL数据库-练习题
MySQL数据库-练习题 一.表关系 请创建如下表,并创建相关约束 二.操作表 1.自行创建测试数据 2.查询“生物”课程比“物理”课程成绩高的所有学生的学号: 3.查询平均成绩大于60分的同学的学号 ...