YYText的使用

        在iOS开发中,经常遇到富文本内容的展示,虽然系统的NSAttributedString功能已经比较完善,但是比较缺乏定制化的内容,如果想自由度更高的显示富文本,可以尝试YYText这个框架。下面会对框架的使用进行简单的介绍。

常用的富文本属性

1.背景色块:系统的AttributedString虽然也有背景色的属性设置,但是有时候需要色块加上圆角。就需要用到YYTextBorder

背景色块


NSMutableAttributedString* str = [[NSMutableAttributedString alloc] initWithString:XX];    //创建内容富文本

[str yy_insertString:@" " atIndex:0];

[str yy_appendString:@" "];            //前后的间距

YYTextBorder * border = [YYTextBorder borderWithFillColor:XXColor cornerRadius:XX];    //创建背景色(颜色与圆角)

border.insets=UIEdgeInsetsMake(0,0,0,0);        //背景色的偏移量

[str setYy_textBackgroundBorder:border];


2.图文混排:也就是字符串中添加图片,就需要用到YYTextAttachment这个类。

先引用一下作者的简单介绍 

YYTextAttachment是NSAttributedString的类簇,它的实例作为富文本key属性YYTextAttachmentAttributeName的value。当富文本包含YYTextAttachment时,它会采用文本规则展示。比如,attachment的内容是UIImage时,它会被绘制为CGContext;attachment的内容是UIView或CALayer时,它会被加入到text container的view层或layer层上。

简单用法

UIImage *image = [UIImage imageNamed:@"XX"];    //要显示的图片

NSMutableAttributedString *attachText = [NSMutableAttributedString yy_attachmentStringWithContent:image contentMode:UIViewContentModeCenter attachmentSize:CGSizeMake(10, 10) alignToFont:[UIFont boldSystemFontOfSize:16] alignment:YYTextVerticalAlignmentCenter];    //content:内容  size:图片尺寸 alignToFont:字符串内字体的格式  

[result appendAttributedString:attachText];     //把图片加入字符串中

字符串的属性还有很多,比如高亮YYTextHightlight,边框YYTextBorder,下划线YYTextBorder 等等等等。可以说是非常丰富了。


YYLabel的使用

        有了富文本的内容,现在就需要一个显示内容的容器,YYKit提供了文本框YYLabel,使用也很方便,下面会举例几个常用的设置。

1.YYTextContainer

显示text的容器,初始化方法分为

矩形: + (instancetype)containerWithSize:(CGSize)size;

和非矩形:+ (instancetype)containerWithPath:(nullableUIBezierPath*)path;

也有一些常见的属性可以设置,如行数 maximumNumberOfRows  大小 size 


 2.YYTextLayout

           用来控制text的布局,大神的分析如下

               这个真的是核心内容了,这个文件一共3300多行的代码,从代码量上就能看出它的地位。这个类中存储着text的layout结果,所有的property都是readonly的。实现的接口有:

               1、通过一些类方法初始化的方法(YYTextContainer、CGSize和text)

               2、layout之后的attributes,都是只读的

               3、从layout中读取信息(位置、range等等)

               4、绘制text layout

               这个类主要是使用上面讲过的所有的数据来绘制text,这部分的代码还是需要一点一点的去读的,如果是新手每一行都会有收获(比如说我),如果是老司机就没有必要一行行的读了,了解他的解题思路和解决这个问题的办法就可以。下面说一下生成layout的那个500行代码的情况,就按照代码的顺序从上往下大概的说明一下干了什么。

                         1)、初始化一系列使用到的变量

                         2)、安全判断,text和container

                         3)、判断是否需要修复emoji的bug(iOS8.3中)

                         4)、判断是否设置了path属性和exclusionPaths数组,做相应的计算拿到cgpath,如果cgpath为空则goto fail 返回nil(如果设置了path,size和insets就没有用了)

                         5)、判断是不是奇偶填充,判断pathWidth是否为0,判断是否是垂直展示

                         6)、使用text创建CTFramesetterRef,创建失败goto fail

                         7)、使用上一步中创建的frameSetter创建CTFrameRef

                         8)、从CTFrameRef的对象中获得每一行、ctRun数组,计算每一行的frame,判断是否实现了linePositionModifier这个协议,有的话调用协议方法。

                         9)、计算bounding size

                         10)、判断是否需要truncation,和按那种方式处理

                         11)、判断是否垂直布局text,需要的话,旋转布局

                         12)、判断得到的visibleRange长度,有效的话遍历text中的attributes,配置对应的layout属性

                         13)、配置layout中的attachments

                         14)、配置结束,返回layout

                    绘制时就是根据layout中的配置情况绘制相应的特征,这段代码在此就不做分析了。

我这边只是用来确定YYLabel的布局,用法如下

YYTextLayout *layout = [YYTextLayout layoutWithContainer:container text:str];

self.label.size= layout.textBoundingSize;

self.titleLabel.textLayout= layout;

        以上就是YYText的一些简单用法,后续如果有新的需求,会更仔细的研究下这个框架更高级的用法,很多功能其实还没有用到,但是已经体会到了代码开源的好处。

        其实我们在开发中遇到的大部门复杂功能,在github中多多少少都能找到类似的框架去参考,很多情况下我们是不需要造轮子的。但是当你找到一个好轮子时,一定要多多理解实现原理,第一能让你后续对框架的改造更容易,第二也是让我们去学习,感受大神的思想,开阔自己的思维,总之是好处多多。而自己写代码时,对一些常用功能,也要做好解耦和封装,也要照着开源的规范要求自己,这样后续的开发中是非常提高效率的。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,491评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,856评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,745评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,196评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,073评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,112评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,531评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,215评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,485评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,578评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,356评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,215评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,583评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,898评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,174评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,497评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,697评论 2 335

推荐阅读更多精彩内容