iOS 富文本效果整理基于NSAttributedString

最新推荐文章于 2021-10-20 21:23:02 发布

RollingPin

最新推荐文章于 2021-10-20 21:23:02 发布

阅读量780

点赞数 2

文章标签： iOS iOS富文本 NSAttributedStr 下划线 iOS图文混编

本文链接：https://blog.csdn.net/RollingPin/article/details/107342773

版权

利用 UILabel 的 attributedText 属性可设置不同的文本样式

首先初始化一个NSAttributedString

NSMutableAttributedString *abStr = [[NSMutableAttributedString alloc] initWithString:@"你看我是富文本"];

这里初始加给label.attributedText,看起来是平平无奇的样子
这里要先设置label的初始textColor和font等,展示基本样式
在这里插入图片描述

然后选择一种样式给label变身吧
这里用到NSAttributedString的各种属性来设置相应的样式

1. 设置字体和大小

NSFontAttributeName
在这里插入图片描述

//设置前三个字 [UIFont systemFontOfSize:15]
[abStr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:15] range:NSMakeRange(0, 3)];

2. 设置间距

NSParagraphStyleAttributeName
在这里插入图片描述

// 这里要用NSMutableParagraphStyle来设置各种属性
// 下面只是简单常用的处理行间距
// 还可以设置首行缩进，行高，对齐方式，段落，连字属性等
NSMutableParagraphStyle *pgpStyle = [[NSMutableParagraphStyle alloc] init];
pgpStyle.lineSpacing = 30; //行间距,注意:实际视觉行距要计算到实际行高
// 行间距是多少倍
// pgpStyle.lineHeightMultiple = 1.5f;
// 首行缩进  
// pgpStyle.firstLineHeadIndent = 30.0f;    
// 对齐方式 
// pgpStyle.alignment = NSTextAlignmentLeft; 
// 内容超出宽度时,内容有...省略的位置 ( "...abc" ,"abc..." ,"ab...c")   
// pgpStyle.lineBreakMode = NSLineBreakByTruncatingTail; 
// 整体缩进
// pgpStyle.headIndent = 30;//左边距    
// pgpStyle.tailIndent = 20;//右边距  
// 行高  
// 针对不同的字型与字号,可以透过指定最大与最小行距来避免过高或过窄的状况发生
// pgpStyle.minimumLineHeight = 10;//最低行高    
// pgpStyle.maximumLineHeight = 20;//最大行高    
// 段落 
// pgpStyle.paragraphSpacing = 15; //段落间距  
// pgpStyle.paragraphSpacingBefore = 30;//段首行空白空间 
// pgpStyle.paragraphSpacing = 30; //段落后面的间距  
[abStr addAttribute:NSParagraphStyleAttributeName
              value:pgpStyle
              range:NSMakeRange(0, 5)];

3. 设置文本颜色

NSForegroundColorAttributeName 在这里插入图片描述

[abStr addAttribute:NSForegroundColorAttributeName value:[UIColor orangeColor] range:NSMakeRange(0, 3)];

4. 设置文字背景色

NSBackgroundColorAttributeName 在这里插入图片描述

[abStr addAttribute:NSBackgroundColorAttributeName value:[UIColor orangeColor] range:NSMakeRange(0, 3)];

5. 设置连字

NSLigatureAttributeName 在这里插入图片描述

说明:
1.PingFangSC_Bold 和 PingFangSC_Regular 一般不会有连字问题
2.PingFangSC-Semibold等字体或者三方字体就有默认连字现象
3.也不是所有的字都会连,一般出现在fi和fl这种字符才会连,具体"连字"的概念问百度or谷歌

NSMutableAttributedString *abStr = [[NSMutableAttributedString alloc]initWithString:@"fiflfi"];
//0表示不连 1表示连 实际中PingFangSC-Semibold等是默认连的
[abStr addAttribute:NSLigatureAttributeName value:@(1) range:NSMakeRange(0, abStr.length)];

6. 设置文字间距

NSKernAttributeName 在这里插入图片描述

[abStr addAttribute:NSKernAttributeName value:@(10) range:NSMakeRange(0, 3)];

7. 设置删除线

NSStrikethroughColorAttributeName
NSStrikethroughStyleAttributeName
在这里插入图片描述

说明:
1.可设置单.双删除线
2.value赋值 [1, 7]是单线, [9, 15]是双线,区间内数值越大,线越粗,注意超出区间内的值,删除线就会失效

[abStr addAttribute:NSStrikethroughStyleAttributeName value:@(5) range:NSMakeRange(0, 3)];
[abStr addAttribute:NSStrikethroughStyleAttributeName value:@(13) range:NSMakeRange(3, 4)];
    
[abStr addAttribute:NSStrikethroughColorAttributeName value:[UIColor orangeColor] range:NSMakeRange(0, 3)];
[abStr addAttribute:NSStrikethroughColorAttributeName value:[UIColor greenColor] range:NSMakeRange(3, 4)];

8. 设置下划线

NSUnderlineStyleAttributeName
NSUnderlineColorAttributeName 在这里插入图片描述

一般常用:value赋值
NSUnderlineStyleSingle //单根细线
NSUnderlineStyleThick //单根粗线
NSUnderlineStyleDouble //双根细线

//样式
[abStr addAttribute:NSUnderlineStyleAttributeName value:@(NSUnderlineStyleSingle) range:NSMakeRange(0, 3)];
//颜色
[abStr addAttribute:NSUnderlineColorAttributeName value:[UIColor orangeColor] range:NSMakeRange(0, 3)];
[abStr addAttribute:NSUnderlineColorAttributeName value:[UIColor greenColor] range:NSMakeRange(4, 3)];

9. 文字描边

NSStrokeWidthAttributeName
NSStrokeColorAttributeName 在这里插入图片描述

NSStrokeWidthAttributeName 这个设置描边字符的宽度,(-∞, 0)区间向内,(0, +∞)区间向外, 注意value设置过大就糊了哟
NSStrokeColorAttributeName 这个设置描边字符的颜色

[abStr addAttribute:NSStrokeWidthAttributeName value:@(2) range:NSMakeRange(0, 3)];
[abStr addAttribute:NSStrokeColorAttributeName value:[UIColor orangeColor] range:NSMakeRange(0, 3)];
    
[abStr addAttribute:NSStrokeWidthAttributeName value:@(-2) range:NSMakeRange(3, 3)];
[abStr addAttribute:NSStrokeColorAttributeName value:[UIColor orangeColor] range:NSMakeRange(3, 3)];

10. 设置文字阴影

NSShadowAttributeName 在这里插入图片描述

NSShadow *shadow = [[NSShadow alloc]init];
shadow.shadowOffset = CGSizeMake(5, 5);
shadow.shadowColor = [UIColor orangeColor];
// shadow.shadowBlurRadius = 5; 阴影模糊度
//貌似range设置无效了,都是这个文本
[abStr addAttribute:NSShadowAttributeName value:shadow range:NSMakeRange(0, abStr.length)];

11. 设置文本特殊效果(用处少)

NSTextEffectAttributeName

只有一直效果类型为NSTextEffectLetterpressStyle //凸版样式

12. 设置文件附件(图文混排)

NSAttachmentAttributeName 在这里插入图片描述

NSTextAttachment *tathment = [[NSTextAttachment alloc]init];
tathment.image = [UIImage imageNamed:@"absImg.png"];
tathment.bounds = CGRectMake(0, 0, 35, 35);
NSAttributedString *imgAbs = [NSAttributedString attributedStringWithAttachment:tathment];
    
[abStr insertAttributedString:imgAbs atIndex:3];

13. 设置链接(只有UITextView可用)

NSLinkAttributeName

value 赋值类型是 NSURL or NSString

在这里插入图片描述

UITextView *tv = [[UITextView alloc]initWithFrame:CGRectMake(0, 100, self.view.bounds.size.width, 200)];
tv.font = [UIFont systemFontOfSize:25];
tv.textAlignment = NSTextAlignmentCenter;
tv.editable = NO;
[self.view addSubview:tv];
    
NSMutableAttributedString *abStr = [[NSMutableAttributedString alloc]initWithString:@"你看我是富文本"];
[abStr addAttribute:NSFontAttributeName value:[UIFont systemFontOfSize:25] range:NSMakeRange(0, abStr.length)];
NSMutableParagraphStyle *pgpStyle = [[NSMutableParagraphStyle alloc] init];
pgpStyle.alignment = NSTextAlignmentCenter;
[abStr addAttribute:NSParagraphStyleAttributeName value:pgpStyle range:NSMakeRange(0, abStr.length)];
    
NSURL *url = [NSURL URLWithString:@"https://www.baidu.com"];
[abStr addAttribute:NSLinkAttributeName value:url range:NSMakeRange(abStr.length-3, 3)];
tv.attributedText = abStr;

14. 文字上下偏移

NSBaselineOffsetAttributeName 在这里插入图片描述

vlaue 赋值正负对应上下偏移

[abStr addAttribute:NSBaselineOffsetAttributeName value:@(6) range:NSMakeRange(2, 1)];
[abStr addAttribute:NSBaselineOffsetAttributeName value:@(-6) range:NSMakeRange(4, 1)];

15. 文字斜体

NSObliquenessAttributeName
在这里插入图片描述

vlaue 赋值正负对应左右斜

[abStr addAttribute:NSObliquenessAttributeName value:@(-0.5) range:NSMakeRange(0, 3)];
[abStr addAttribute:NSObliquenessAttributeName value:@(0.5) range:NSMakeRange(4, 3)];

15. 文字拉伸

NSExpansionAttributeName // 横向拉伸
在这里插入图片描述

vlaue 赋值正负对应变胖瘦

[abStr addAttribute:NSExpansionAttributeName value:@(-0.5) range:NSMakeRange(0, 3)];
[abStr addAttribute:NSExpansionAttributeName value:@(0.5) range:NSMakeRange(4, 3)];

16. 文字书写方向(一般用于自右向左)

NSWritingDirectionAttributeName
在这里插入图片描述

[abStr addAttribute:NSWritingDirectionAttributeName value:@[@(NSWritingDirectionRightToLeft|NSWritingDirectionOverride)] range:NSMakeRange(0, abStr.length)];