使用 Masonry 实现两个不固定文字长度的 Label 在同一个 View 中,并让父视图自适应高度 iOS

 

使用 Masonry 实现两个不固定文字长度的 Label 在同一个 View 中,并让父视图自适应高度,可以这样实现:

// 创建父视图
UIView *containerView = [[UIView alloc] init];
[self.view addSubview:containerView];

// 创建第一个 Label
UILabel *label1 = [[UILabel alloc] init];
label1.numberOfLines = 0; // 关键:允许多行显示
label1.text = @"不固定的文字内容1...";
[containerView addSubview:label1];

// 创建第二个 Label
UILabel *label2 = [[UILabel alloc] init];
label2.numberOfLines = 0; // 关键:允许多行显示
label2.text = @"不固定的文字内容2...";
[containerView addSubview:label2];

// 设置父视图约束(宽度固定,高度自适应)
[containerView mas_makeConstraints:^(MASConstraintMaker *make) {
    make.center.equalTo(self.view);
    make.width.mas_equalTo(300); // 设置固定宽度或相对宽度
}];

// 设置第一个 Label 约束
[label1 mas_makeConstraints:^(MASConstraintMaker *make) {
    make.top.left.right.equalTo(containerView).insets(UIEdgeInsetsMake(10, 10, 0, 10));
}];

// 设置第二个 Label 约束
[label2 mas_makeConstraints:^(MASConstraintMaker *make) {
    make.top.equalTo(label1.mas_bottom).offset(10); // 与 label1 的间距
    make.left.right.equalTo(containerView).insets(UIEdgeInsetsMake(0, 10, 10, 10));
    make.bottom.equalTo(containerView).offset(-10); // 关键:连接到底部
}];

关键点说明:

  1. 1.多行支持:两个 Label 都要设置 numberOfLines = 0
  2. 2.约束链:通过 label1.top -> label1.bottom -> label2.top -> label2.bottom -> containerView.bottom形成完整的垂直约束链
  3. 3.底部约束:最后一个 Label 必须与父视图底部连接(make.bottom.equalTo(containerView).offset(-10)
  4. 4.宽度固定:父视图需要有明确的宽度约束,高度才能正确计算

如果需要动态更新内容后刷新布局:

// 更新文字内容后调用
[label1 setText:@"新的长文字..."];
[label2 setText:@"另一个长文字..."];

// 强制刷新布局
[containerView setNeedsLayout];
[containerView layoutIfNeeded];

// 或者使用 Masonry 的更新约束方法
[containerView mas_updateConstraints:^(MASConstraintMaker *make) {
    make.width.mas_equalTo(新宽度); // 如果需要调整宽度
}];

这样父视图就会根据两个 Label 的内容自动调整高度,支持文字长度变化时的自适应。

posted @ 2025-11-29 17:29  黄增松  阅读(2)  评论(0)    收藏  举报