如何在显示旋转时以编程方式更改布局约束 [英] How to change layout constraints programmatically on display rotation

问题描述

对于一个应用程序(与iOS 7兼容)，我需要在横向和纵向模式下具有完全不同的布局.我看到了以编程方式设置约束并在旋转时更改约束的唯一方法.因此，我使用IB设置界面，然后以编程方式设置约束.

For an app (iOS 7 compatible) I need to have the possibility for totally different layouts in landscape and portrait mode. I see the only way in setting the constraints programmatically and change them on rotation. So I set my interface using IB and then set the constraints programmatically.

我在某处看到了一种方法，该方法首先删除所有约束，然后创建和添加新约束，然后为父视图上的约束设置更新标志.我希望这些元素只是整个屏幕的宽度，一个在另一个的下面:

I saw somewhere the approach to remove first all constraints, then create and add new constraints and then set the update flag for constraints on the parent view. I want the elements just to be full width of the screen and one underneath the other:

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {

    self.landscapeConstraints = [NSMutableArray new];
    self.portraitConstraints = self.view.constraints;

    //creation of the viewsDictionary

    [self.landscapeConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[segmentedControl]-|" options:0 metrics:nil views:viewsDictionary]];
    [self.landscapeConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[fullText]-|" options:0 metrics:nil views:viewsDictionary]];
    [self.landscapeConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[bubbleTitle]-|" options:0 metrics:nil views:viewsDictionary]];
    [self.landscapeConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[bubble]-|" options:0 metrics:nil views:viewsDictionary]];
    [self.landscapeConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[chartView]-|" options:0 metrics:nil views:viewsDictionary]];
    [self.landscapeConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(20)-[segmentedControl]-[fullText]-[bubbleTitle]-[bubble]-[chartView]|" options:0 metrics:nil views:viewsDictionary]];

    [self.view removeConstraints:self.portraitConstraints];
    [self.view addConstraints:self.landscapeConstraints];

    [self.view setNeedsUpdateConstraints];
}

我的问题:这种方式是否完整和正确?

My question: Is this way complete and correct?

我要问这个问题，因为旋转后元素太大了.旋转后似乎超级视图的大小不正确.因此，所有元素都太大，似乎最大的元素(长文本标签)给出的宽度比屏幕大得多.如果我在约束中设置了一个具有大小的元素(例如[segmentedControl(== 500)])，那么该元素的大小就可以了，所有其他元素也都具有该大小.

I come to this question, since the elements are too big after the rotation. It looks like the size of the superview is not correct after rotation. All elements are therefore too big and it seems that the biggest element (a long text label) is giving the width, which is a lot bigger than the screen. If I set one of the elements with a size in the constraints (eg. [segmentedControl(==500)] then the size of this element is ok and ALL other elements also have that size.

命令

NSLog(@"%@", [self.view performSelector:@selector(_autolayoutTrace)]);

为我提供了所有元素的类似内容:

gives me something like this for all elements:

*UIView:0x7f9a38f36510- AMBIGUOUS LAYOUT for UIView:0x7f9a38f36510.minX{id: 9}, UIView:0x7f9a38f36510.minY{id: 12}, UIView:0x7f9a38f36510.Width{id: 15}, UIView:0x7f9a38f36510.Height{id: 17}

有人可以提示我我做错了什么吗?我现在已经花了几个小时了……

Can anyone hint me where I am doing wrong? I am working on this for hours now...

编辑

我真正不明白的是:除去所有约束后，解决方案似乎也是通过这样的约束来定义超级视图的大小:

What I really don't understand: It seems the solution after I removed all constraints would be to define the size of the superview also by a constraint like this:

NSDictionary *viewsDictionary = @{ @"view":self.view};

[self.landscapeConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[view(360)]" options:0 metrics:nil views:viewsDictionary]];
[self.landscapeConstraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view(650)]" options:0 metrics:nil views:viewsDictionary]];

否则，所有视图都将崩溃，因为超级视图的大小似乎为零.而且即使有这些额外的限制，视图也仍然位于左侧(约20像素)！

Otherwise all views collapse, since the superview seems to have zero-size. And even with these additional constraints the view sits too far left (about 20px)!

有人可以向我解释吗?我真的需要使用当前窗口大小手动生成该约束吗?我希望包含的视图(这是主窗口)具有全屏的大小.

Can anyone explain that to me? Do I really need to generate that constraint manually with the current size of the windows?? I would expect the containing view (which is the main window) to have the size of the full screen.

推荐答案

您可以像进行设置一样设置布局约束，但是也可以使用IBOutlet引用它们，并以编程方式进行更改(并调用 layoutIfNeeded 之后).不查看布局就很难分析代码，但是您的Log显示约束不够精确(模糊).要知道哪个视图，您也可以分别记录这些视图并获取每个视图缺少的约束.然后，一一设置约束，使约束不再模糊.

You can set the layout constraints like you did, but you can also reference them with an IBOutlet and just change them programmatically (and call layoutIfNeeded after). It is very difficult to analyze your code without seeing the layout, but your Log shows that the constraints are not enough precise (ambiguous). To know which view is which, you can log the views individually as well and get the missing constraint for each view. Then one by one set the constraints so that it is not ambiguous anymore.

在您的声明中:

@property (nonatomic, weak) IBOutlet NSLayoutConstraint *leftMarginViewXYZ;

然后在Interface Builder中，右键单击约束并绘制对ViewController的引用.释放按钮时，选择正确的约束.

then in Interface Builder you right click on the constraint and draw the reference to your ViewController. When releasing the button you select the right constraint.

然后，您可以在代码中使用来更改约束

In your code you can then change the constraint with

self.leftMarginViewXYZ.constant = 123;
[self.view layoutIfNeeded];

这篇关于如何在显示旋转时以编程方式更改布局约束的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！