如何在自动布局中以编程方式执行 uilabel

Posted 2023-03-15

【中文标题】如何在自动布局中以编程方式执行 uilabel

【英文标题】：how to do uilabel programmatically in auto layout

【发布时间】：2015-04-16 13:19:44

【问题描述】：

我在 Xcode 6 中做一个自动布局的项目，我正在以编程方式添加一个标签，它在 4s、5、5s 中完美工作，但在 6 和 6 plus 中不起作用。谁能帮助我，我是自动布局的新手。下面是我的编码。

UIScrollView *scroll = [[UIScrollView alloc]init];
[scroll setTranslatesAutoresizingMaskIntoConstraints:NO];
scroll.contentSize=CGSizeMake(480, 600);

[centerView addSubview:scroll];

NSDictionary *scrolldic = @@"scrollview":scroll;

NSArray *scroll_H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[scrollview(480)]" options:0 metrics:Nil views:scrolldic];

NSArray *scroll_V = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[scrollview(480)]" options:0 metrics:Nil views:scrolldic];

[scroll addConstraints:scroll_H];
[scroll addConstraints:scroll_V];
NSArray *scroll_posH = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[scrollview]" options:0 metrics:Nil views:scrolldic];

NSArray *scroll_posV = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[scrollview]" options:0 metrics:Nil views:scrolldic];


[self.view addConstraints:scroll_posH];
[self.view addConstraints:scroll_posV];
UILabel *header = [[UILabel alloc]init];
[header setTranslatesAutoresizingMaskIntoConstraints:NO];
header.backgroundColor = [UIColor blueColor];


 [scroll addSubview:header];

NSDictionary *headerdic = @@"header":header;

NSArray *header_H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[header(150)]" options:0 metrics:Nil views:headerdic];

 NSArray *header_V = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[header(30)]" options:0 metrics:Nil views:headerdic];

[header addConstraints:header_H];
[header addConstraints:header_V];

 NSArray *header_posH = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-80-[header]" options:0 metrics:Nil views:headerdic];

 NSArray *header_posV = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[header]" options:0 metrics:Nil views:headerdic];


[self.view addConstraints:header_posH];
[self.view addConstraints:header_posV];

在 4s 标签中看到上面的图像在中心是正确的，但是在 6 中它向左移动，有什么问题可以帮助我。

【问题讨论】：

您的约束没有将header 对齐到中心，它们将其前导空间设置为scroll 到80..

@JakubVano 谢谢，但我不明白你可以在编码中解释一下。

【参考方案1】：

要让它发挥作用，您希望布局在不同设备上的外观也很重要。标签应始终具有 150 的宽度并居中，还是应始终具有 80 的左右填充？

这是你必须决定的，但约束看起来像这样：

第一种情况（宽度相同，居中）：

NSLayoutConstraint *centerXConstraint = [NSLayoutConstraint constraintWithItem:header attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem: scroll attribute:NSLayoutAttributeCenterX multiplier:1.f constant:0];
[scroll addConstraint:centerXConstraint];

第二种情况（保持设备之间的填充）：

[scroll addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-leftPadding-[header]-leftPadding-|" options:0 metrics:@ @"leftPadding": @(80)  views:@ @"header": header ]];

如果您需要更多帮助，请告诉我。

【参考方案2】：

尝试像这样添加约束

NSLayoutConstraint *leadingConstraint= [NSLayoutConstraint constraintWithItem:self.contentView attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:_yourLabel attribute:NSLayoutAttributeCenterX multiplier:1.0 constant:0];
NSLayoutConstraint *topConstraint= [NSLayoutConstraint constraintWithItem:self.contentView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:_yourLabel attribute:NSLayoutAttributeTop multiplier:1.0 constant:0];
[self.contentView addConstraints:@[leadingConstraint,topConstraint]];

【参考方案3】：

问题似乎是您将值硬编码在其中。这对于 iPhone 4 和 5 来说很好，因为它们的屏幕宽度均为 320。这意味着您的硬编码值 80 将其保持在中间。

iPhone 6 的屏幕更宽

iPhone 4 和 5

|---80---|--150--|---90---|

您可以通过上面的屏幕截图看到这一点：

在这里，我添加了两条长度相同的绿线，尽管您认为您的标签在 iPhone 4 和 5 的中间，但实际上并非如此。

您需要做的是以下两件事之一：

使用 NSLayoutConstraints 将视图固定在中间，而不是设置值。有各种布局约束将其置于中间。

您可以为此使用 centerX

NSLayoutConstraint * centreConstraint = [NSLayoutConstraint constraintWithItem:self.contentView attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:_yourLabel attribute:**NSLayoutAttributeCenterX** multiplier:1.0 constant:0];

然后添加此约束（NSLayoutConstraint 可能非常繁琐，因此请确保您对其进行测试，因为这可能不起作用）

这会将标签设置在屏幕中间（因此 centerX - 表示 x 轴的中心）

另一种方法，不推荐，如果您尝试同时设置横向和纵向，则计算屏幕宽度，然后输入准确的中间填充值。

你可以计算屏幕的宽度

[UIScreen mainScreen].bounds.size.width

然后你可以计算你需要它的值例如在你的情况下它会是

// Your label is 150 pixels wide so the space on each side is the width less 150 but half as you have the same amount on each side.
([UIScreen mainScreen].bounds.size.width - 150)/2

这是一种简单计算所需值的方法，不如使用 NSLayoutConstraint。它更简单，但用途更少。我只是为了完整性而包含它。

我的建议是，查看 NSLayoutConstraints this one is good 的一些教程，更好地了解您的约束。