如何制作一个有 2 个视图覆盖屏幕且不重叠的屏幕

Question

我正在尝试创建一个带有 2 个视图的视图控制器，它看起来就像在 IB 中一样

但他们只在 iPhone 5s 时才会这样在其他情况下，它看起来像横向图像上显示的方式。我使用 size 类来设置不同屏幕方向的约束。

这是 iPhone 6 秒加上

后的样子

Answer 1

Any/Compact 表示任何具有紧凑宽度的 phone，小于 6 的 iPhone 就是这样。您需要为 Regular/Compact 设置约束才能为非 6+ 的 iPhone 设置纵向约束。

Answer 2

你应该给出约束，比如，

top, bottom, leading and trailing 两个视图。

然后 select 两个视图并给予 equal height 约束，您将得到想要的结果。

你可以在any any中给它。它适用于任何方向。

希望这会有所帮助:)

Answer 3

使用 UIStackView 容易得多。

Select你的两个观点。
点击右下角的图标在它们周围创建一个 UIStackView。
根据方向将新的 UIStackView 设置为水平或垂直。
将其固定到封闭视图。大功告成！

有一个good tutorial here；我强烈建议您先练习使用堆栈视图进行设置，然后再以困难的方式进行操作。

Answer 4

将此添加到您的 viewController

的 viewDidLoad 方法中

UIView *firstView = [[UIView alloc] init];     
self.navigationController.navigationBar.translucent = false;
firstView.backgroundColor = [UIColor redColor];

firstView.translatesAutoresizingMaskIntoConstraints = false;
[self.view addSubview:firstView];
    NSLayoutConstraint *topFirstViewYConstraint = [

NSLayoutConstraint constraintWithItem:firstView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTop multiplier:1.0f constant:0.0f

];

NSLayoutConstraint *centerFirstViewHeightConstraint = [ NSLayoutConstraint constraintWithItem:firstView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeHeight multiplier:0.5f constant:0.0 ];

NSLayoutConstraint *centerFirstViewWidthConstraint = [ NSLayoutConstraint constraintWithItem:firstView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeWidth multiplier:1.0f constant:0.0f ]; [super.view addConstraints:@[ topFirstViewYConstraint, centerFirstViewHeightConstraint,centerFirstViewWidthConstraint]];

UIView *secondView = [[UIView alloc] init];
secondView.backgroundColor = [UIColor greenColor];
secondView.translatesAutoresizingMaskIntoConstraints = false;
[self.view addSubview:secondView];
NSLayoutConstraint *topSecondViewYConstraint = [

NSLayoutConstraint constraintWithItem:secondView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:firstView attribute:NSLayoutAttributeBottom multiplier:1.0f constant:0.0f ]; NSLayoutConstraint *centerSecondViewHeightConstraint = [ NSLayoutConstraint constraintWithItem:secondView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeHeight multiplier:0.5f constant:0.0 ]; NSLayoutConstraint *centerSecondViewWidthConstraint = [ NSLayoutConstraint constraintWithItem:secondView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeWidth multiplier:1.0f constant:0.0f ]; [super.view addConstraints:@[ topSecondViewYConstraint, centerSecondViewHeightConstraint, centerSecondViewWidthConstraint]];

Answer 5

所以问题似乎是 iPhones 早于 iPhone 6+ 具有 wCompact hCompact 尺寸 class 横向。你应该记住不要使用像 wCompact hAny 这样的大小 classes，因为它们会覆盖紧凑的大小 class.

所以，实际上，在这种情况下您需要创建 3 个尺寸 classes： wCompact hRegular - 所有肖像 wCompact hCompact - iPhones 早于 6+ wRegular hCompact - 所有其他

如何制作一个有 2 个视图覆盖屏幕且不重叠的屏幕

How can I make a screen which has 2 views covering the screen and not overlapping

interface-builder

ios

nslayoutconstraint

size-classes