如何从底部对齐 UILabel 文本？

Question

UILabel如何从底部对齐。 比方说，我的标签可以容纳三行文本。如果输入文本是单行，那么这行应该在标签的底部。请参考下图以便更好地理解。 橙色区域是label的全框，目前只有一行，居中对齐。 所以我想要的是，无论有多少行，它都应该始终与底部对齐。

请提出你的想法。

谢谢你。

Answer 1

这里有两种方法可以做到这一点......

1.首先将numberOfLines设置为 0，然后使用UILabel sizeToFit属性，以便您的UILabel显示其contentSize 。

yourLabel.numberOfLines = 0;

[yourLabel sizeToFit];

从此链接查看更多信息： 垂直对齐 UILabel 中的文本

2.另一种选择是采用UITextField而不是UILabel并将userInteractionEnabled设置为NO如下...

[yourTextField setUserInteractionEnabled:NO];

然后将contentVerticalAlignment属性设置为底部，如下所示...

[yourTextField setContentVerticalAlignment:UIControlContentVerticalAlignmentBottom];

更新

此外，使用UITextField ，我们无法实现多行。 因此，我们可以使用UITextView并将其userInteractionEnabled设置为NO 。 然后，使用下面的代码使其底部对齐。

CGFloat topCorrect = ([label bounds].size.height - [label contentSize].height);
topCorrect = (topCorrect <0.0 ? 0.0 : topCorrect);
label.contentOffset = (CGPoint){.x = 0, .y = -topCorrect};

Answer 2

Swift 4.2 版本使用contentMode属性设置顶部和底部：

class VerticalAlignedLabel: UILabel {
    
    override func drawText(in rect: CGRect) {
        var newRect = rect
        switch contentMode {
        case .top:
            newRect.size.height = sizeThatFits(rect.size).height
        case .bottom:
            let height = sizeThatFits(rect.size).height
            newRect.origin.y += rect.size.height - height
            newRect.size.height = height
        default:
            ()
        }
        
        super.drawText(in: newRect)
    }
}

然后像这样设置你的标签：

let label = VerticalAlignedLabel()
label.contentMode = .bottom

Answer 3

子类 UILabel

@interface Label : UILabel

@end

然后像这样覆盖 drawTextInRect

@implementation Label

- (void)drawTextInRect:(CGRect)rect
{
    if(alignment == top) {

        rect.size.height = [self sizeThatFits:rect.size].height;
    }

    if(alignment == bottom) {

        CGFloat height = [self sizeThatFits:rect.size].height;

        rect.origin.y += rect.size.height - height;
        rect.size.height = height;
    }

    [super drawTextInRect:rect];
}

@end

Answer 4

我只为 IB 中的超级视图设置了一个底部约束，这对我有用，而无需使用代码以及最大约束的行数。

Answer 5

我最近遇到了这个问题，并且能够通过将我的标签单独放在堆栈视图中来解决它。 我从这篇文章中得到了这个想法，它有同样的问题，但有多个标签。 可以对单个标签使用相同的技术。

stackview 将有轴 = 水平和对齐 = 底部（这就是诀窍）。

我的标签现在与底部完美对齐，这正是我所需要的。

Answer 6

我遇到过同样的问题。 这是我如何将文本与 UILabel 的底部对齐：

- (void)alignLabel:(UILabel *)l withText:(NSString *)text verticalAlignOption:(int)vertAlign{
CGSize stringSize = [text sizeWithFont:l.font constrainedToSize:l.frame.size lineBreakMode:l.lineBreakMode];

switch (vertAlign) {
    case 0: // align = top
        l.frame = CGRectMake(l.frame.origin.x,
                                   l.frame.origin.y,
                                   l.frame.size.width,
                                   stringSize.height
                                   );
        break;
    case 1: // align = bottom
        l.frame = CGRectMake(l.frame.origin.x,
                                   (l.frame.origin.y + l.frame.size.height) - stringSize.height,
                                   l.frame.size.width,
                                   stringSize.height
                                   );
        break;
    case 2: // align = middle
        // default
        break;
}

l.text = text;
}

啊，你简单地调用这样的方法来对齐到底部：

[self alignLabel:self.mediaTitle withText:@"My text to align" verticalAlignOption:1];

Answer 7

另一种选择：使用一个标签作为背景颜色，我称之为 originalLabel，另一个用于文本，在我的示例中称为 textLabel。 然后计算 textLabel 的高度和 Y 坐标：

[textLabel sizeToFit];
int height = textLabel.frame.size.height;
int yCoord = originalLabel.frame.origin.y + 
          originalLabel.frame.size.height - height;
textLabel.frame = CGRectMake( originalLabel.frame.origin.x, yCoord,
          textLabel.frame.size.width, height);

Answer 8

在 IB 中，@Tobe 说对超级视图的底部约束应该有效，如果您有多个子视图或水平堆栈视图，其中一个元素具有底部约束，则使用布局边距固定，底部小于其他边距

Answer 9

将您的 UILabel 放在一个垂直的 UIStackView 中，并使用一个虚拟视图作为间隔。 此外，将虚拟视图设​​置为较低的拥抱和压缩优先级。

从上到下：

• 标签
• 虚拟视图

从下到上：

• 虚拟视图
• 标签

截屏

Answer 10

您可以UILabel并覆盖该方法：

- (void)drawTextInRect:(CGRect)rect

使用要使用的矩形调用 super drawTextInRect 。

Answer 11

2021. 使用自动布局）

textLabel.numberOfLines = 0
textLabel.textAlignment = .center

textLabel.topAnchor.constraint(greaterThanOrEqualTo: sView.topAnchor).isActive = true
textLabel.leadingAnchor.constraint(equalTo: sView.leadingAnchor).isActive = true
textLabel.trailingAnchor.constraint(equalTo: sView.trailingAnchor).isActive = true
textLabel.bottomAnchor.constraint(equalTo: sView.bottomAnchor).isActive = true