iOS两边都对齐的UI布局

在项目中经常遇到UI布局是多行展示的,如下图所示,


iOS两边都对齐的UI布局_第1张图片
奋斗的七月

上图可以明显看出来,左边是对齐的显示,但是右边是参差不齐。
所以可以使用下面的方法,一句代码就可以实现两边都对齐的方式:

lbl.textAlignment = NSTextAlignmentJustified;

下面是效果图:


iOS两边都对齐的UI布局_第2张图片
奋斗的七月

但是如果是单行的这种布局,如下图所示:

iOS两边都对齐的UI布局_第3张图片
奋斗的七月

这个需要Lable两边都对齐,需要这种效果,但是发现设置任何一种文本对齐方式都不对。

所以我写了一个UILable类别,在类别中写了一个设置这种布局的方法,只需要传入这个Lable的宽度就行。

- (void)setAlightLeftAndRightWithWidth:(CGFloat)labelWidth {
    
    CGSize testSize = [self.text boundingRectWithSize:CGSizeMake(labelWidth, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin | NSStringDrawingTruncatesLastVisibleLine| NSStringDrawingUsesFontLeading attributes:@{NSFontAttributeName :self.font} context:nil].size;
    
    CGFloat margin = (labelWidth - testSize.width)/(self.text.length - 1);
    NSNumber *number = [NSNumber numberWithFloat:margin];
    NSMutableAttributedString *attribute = [[NSMutableAttributedString alloc] initWithString:self.text];
    
    [attribute addAttribute: NSKernAttributeName value:number range:NSMakeRange(0, self.text.length - 1 )];
    self.attributedText = attribute;
}

注意:这个方法需要在lable.text赋值之后 才能进行调用,不然会出现崩溃。

你可能感兴趣的:(iOS两边都对齐的UI布局)