Label设置行间距,单行多行的处理
问题引入
实际开发中,遇到这样一个需求.乍一看,so easy,设置行间距.做出来后,才发现这里有坑,单行文本,你会发现底部会多出一截白条,导致整个排版混乱.那怎么解决这个问题呢
tmp1d8a0663.png
内容摘要
- UILabel显示多行文本
- UILabel设置行间距
- 解决单行文本 & 多行文本显示的问题
场景描述
- 众所周知，UILabel显示多行的话，默认行间距为0，但实际开发中，如果显示多行文本，一般情况下会有一定的行间距。如果想动态调整行间距，则需要赋值富文本属性（而不是文本属性）
问题分析
Label显示多行文本
-
label默认情况下，只会显示单行文本，主要是因为它的numberOfLines属性值是1；如果要显示多行，把这个属性值改成0即可。
label.numberOfLines = 0;
1.png
-
如果想添加行间距，我们会这样做：
NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:string]; NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init]; paragraphStyle.lineSpacing = lineSpace; // 调整行间距 NSRange range = NSMakeRange(0, [string length]); [attributedString addAttribute:NSParagraphStyleAttributeName value:paragraphStyle range:range]; 多行时效果OK,但单行时,却有问题
2.png
解决思路
思路一.设置文本偏移量,使其垂直居中显示,偏移量大小要根据字体大小动态调整.
偏移量大小的计算要仔细一些,一定要准确.
// 设置文本偏移量
[attributedString addAttribute:NSBaselineOffsetAttributeName value:@(lineOffset) range:range];
思路二. 我不想计算偏移量大小,还有没有其他简单的替代方案. 换个思路,单行的时候,不设置行间距. 多行时设置行间距. 那么这就转换成了怎么样判断单行多行的判断了
//2.添加特权信息label
UILabel *tip = [[UILabel alloc] init];
tip.font = [UIFont systemFontOfSize:15];
tip.numberOfLines = 0;
[self.contentView addSubview:tip];
tip.text = string;
CGSize size = [tip sizeThatFits:CGSizeMake(SCREEN_WIDTH - 70, CGFLOAT_MAX)];
CGFloat tipHeight = 0;
//2.1 计算文本高度,文本只有一行
if (size.height < 2 * [UIFont systemFontOfSize:15].lineHeight) {
tipHeight = [UIFont systemFontOfSize:15].lineHeight;
//2.1 计算文本高度,文本有多行
}else {
//设置文本行间距...
}
demo 地址
https://github.com/HelloYeah/SKAlertVipLimits
注
部分内容引自https://www.jianshu.com/p/82ddeeb48e16