带有约束的 UIStoryboard 自动布局问题答案

【问题标题】：UIStoryboard autolayout issues with constraints带有约束的 UIStoryboard 自动布局问题
【发布时间】：2012-10-25 20:20:36
【问题描述】：

非常简单（我希望）的自动布局问题，我正在用头撞我的 iMac。

这个是纵向的

这就是风景中发生的事情。

我想要的只是让标签像不使用自动布局时那样展开。我应该添加什么约束来均匀地间隔它们？

【问题讨论】：

Autolayout Even Spacing 的可能重复项
如果您不想或不需要自动布局，请将其关闭 - 故事板中的文件检查器，取消选中使用自动布局。
我可以为情节提要中的一个视图控制器执行此操作吗？而且我不想关闭它，我想学习如何纠正这个问题。
@jrturton，该链接没有帮助。
您只能对整个文件关闭它。如链接中所述，即使是这样的间距（IMO）也只能通过在代码中布局视图来实现。如果你有可变的按钮宽度（或所有相等的宽度）和它们之间的标准间距，你可以在故事板中做到这一点。

标签： objective-c xcode constraints uistoryboard autolayout

【解决方案1】：

有一个比@sust86更简单也更灵活的解决方案：

引入空视图作为标签之间的弹簧。
使用恒定距离约束连接所有相邻视图。
将其中一个新的 spring 视图与具有相同宽度约束的所有其他 spring 视图连接起来。
删除所有不需要的约束。

对我来说，约束看起来类似于：

这种配置的优点是，当标签（在我的例子中是按钮）的宽度发生变化时，您不需要修复任何间距。

【讨论】：

【解决方案2】：

在 iOS 6 中使用新的约束是很棘手的。在 ray 的网站上有一个很好的 2 部分教程，与 iOS 6 中的自动布局相关。虽然它解释了如何在自动布局中锚定图像持有者，但这些原则帮助我理解了整个自动布局。希望这对你也有帮助。这里是链接： http://www.raywenderlich.com/20881/beginning-auto-layout-part-1-of-2 阿德里安

【讨论】：

这是一个很好的教程，但我没有看到任何与问题直接相关的内容。

【解决方案3】：

试试这个：

#define moneyLabelWidth 20
@property (nonatomic, strong) UILabel* moneyOneLabel;
@property (nonatomic, strong) UILabel* moneyTwoLabel;
@property (nonatomic, strong) UILabel* moneyThreeLabel;
@property (nonatomic, strong) UILabel* moneyFourLabel;
@property (nonatomic, strong) UILabel* moneyFiveLabel;
@property (nonatomic, strong) UILabel* moneySixLabel;
...
[self.view addSubview:moneyOneLabe];
[self.view addSubview:moneyTwoLabe];

moneyOneLabel.translatesAutoresizingMaskIntoConstraints = NO;
moneyTwoLabel.translatesAutoresizingMaskIntoConstraints = NO
etc
...


[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[_moneyOneLabel(moneyLabelWidth)]-[_moneyTwoLabel(moneyLabelWidth)]-[_moneyThreeLabel(moneyLabelWidth)]-[_moneyFourLabel(moneyLabelWidth)]-[_moneyFiveLabel(moneyLabelWidth)]-[_moneySixLabel(moneyLabelWidth)]-|"
                                                                  options:0
                                                                  metrics:@{@"moneyLabelWidth":@(moneyLabelWidth)}
                                                                    views:NSDictionaryOfVariableBindings(_moneyOneLabel, _moneyTwoLabel, _moneyThreeLabel, _moneyFourLabel, _moneyFiveLabel, moneySixLabel)]];
/*add vertical constraints*/

上面的constrainsWithVisualFormat基本上是说从左边到右边水平绘制6个货币标签，宽度均为20，它们之间的宽度是可变的。我还没有运行此代码，但我认为它会起作用（或至少接近）。

【讨论】：

【解决方案4】：

最简单的方法是在每个视图之间使用 2 个约束。一种具有大于或等于，一种具有小于或等于。最小尺寸（Greater Then 或 Equal）应该是纵向模式下的间距。最大尺寸（Lesser Then 或 Equal）应该是横向模式下的间距。

这与我为这个问题提供的解决方案相同：

Using Auto Layout to change spaces equally on resizing

【讨论】：