XCode：如何在横向和纵向模式之间更改视图布局 [英] XCode: How to change layout of views between landscape and portrait mode

问题描述

在纵向模式下，我从视图控制器的顶部到底部有四个视图（参见图像）。

In portrait mode I have four views on top of one another from the top to the bottom of the view controller (see image).

然后我想在设备转换为横向时更改视图相对于彼此的位置（参见图2）。

I then want to change the position of the views relative to one another when the device transitions to landscape (see image two).

我希望视图4与视图2和3一起移动，并且它们全部位于视图1下方。

I want view 4 to move alongside views 2 and 3 and them all the sit below view 1.

一些布局条件：

• 视图1以横向和纵向方式附加到视图控制器的顶部。


• 视图4以纵向模式附加到视图控制器的左，右和下边距。


• 视图2,3和& 4在纵向视图中水平居中。

实现不同布局的最佳方法是什么？

What is the best method to achieve the different layouts?

最优雅的解决方案是引用视图控制器代码中的约束并在viewWillTransition中激活和停用它们吗？或者有没有办法使用各种特性来实现这一点（我可以想象水平居中的视图2,3和4将难以实现，以及在横向模式下为视图4添加新约束）？ / p>

Would the most elegant solution be to make a reference to the constraints in the view controllers code and activate and deactivate them in viewWillTransition? Or is there a way to use vary for traits to achieve this (I can imagine views 2, 3 & 4 being centered horizontally would make this hard to achieve, as well as adding the new constraints for view 4 in landscape mode)?

推荐答案

我们过去常常设置不同的约束集，并根据方向的变化激活/停用它们。但是现在可以使用大小类和因特征而异。

We used to set up different sets of constraints and activate/deactivate them based upon orientation change. But nowadays can use size classes and "vary for traits".

例如，我从一个简单的视图开始，选择一个紧凑的宽度大小类，然后选择Vary for特征：

For example, I start with a simple view and choose a compact width size class and then choose "Vary for traits":

然后添加相应的约束并点击完成变化：

I then add the appropriate constraints and click on "Done varying":

I然后选择常规宽度大小类并重复该过程（对特征变化，添加约束，单击完成变化：

I then choose a "regular width size class" and repeat the process ("Vary for traits", add the constraints, click on "Done varying":

然后你最终得到一个完整的场景对紧凑宽度大小类和常规宽度大小类有效的不同约束集。即当我运行应用程序时，如果设备旋转，则会激活新约束：

You then end up with a scene that will have a completely different set of constraints active for compact width size classes and regular width size classes. I.e. when I run the app, if the device rotates, the new constraints are activated:

有关更多信息，请参阅有关自适应布局的WWDC 2016视频：

For more information, see WWDC 2016 videos on adaptive layouts:

• https://developer.apple.com/videos/play/wwdc2016/222


• https://developer.apple.com/videos/play/wwdc2016/233

• https://developer.apple.com/videos/play/wwdc2016/222
• https://developer.apple.com/videos/play/wwdc2016/233

这篇关于XCode：如何在横向和纵向模式之间更改视图布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！