在自动布局中，当屏幕方向改变为横向时隐藏一个视图。

Question

我正在创建一个示例应用程序，其中我复制Facebook屏幕以练习自动布局。当我在纵向模式下运行登录屏幕时，它看起来很完美。

问题是一旦方向改变为横向，所有视图都会因为标题图片而崩溃，如此显示。

我想要的是，在横向模式下，标题图片消失，以便其他视图获得其空间。我不想使用scrollview。

我尝试过这个：

headerImageView.isHidden = true

但结果显示为 this。 ImageView 消失了，但没有离开其空间。 有人能给我提供一个好的解决方案吗？

P.s 由于我的声望，很抱歉图片是这样的。

- kinza

---

我认为，如果您正在使用约束条件，而不是隐藏headerImageView，请将headerImageView的高度约束设置为零，看看是否有效。 - Amit

它不起作用。 - kinza

Answer 1

使用自动布局时，可以利用大小类别。 请参阅以下说明或在此处查看示例：https://github.com/jonaszmclaren/AutolayoutExample

设置图像视图为紧凑的宽度和高度（wC hC-横向iPhone），并为wR hC（横向iPhone Plus）设置为未安装：

文本字段和图像视图之间的约束在wC hC和wR hC上未启用：

最后，在wC hC和wR hC中，您必须定义文本字段的顶部约束-我将其固定到视图的顶部。

这样，肖像模式下将显示图像视图，并将文本视图固定在图像视图上，在横向模式下图像视图将被隐藏，并将文本字段固定在视图顶部。

- jonaszmclaren

---

我没有任何 wC hC 选项。:( 我正在使用 Xcode 8 工作。 - kinza

是的，你做到了。选择所需的限制条件，在“大小检查器”旁边的“已安装”选项下方，有一个小加号，你可以在那里定义新的变体。 - jonaszmclaren

你的解决方案已经产生了一些变化，但现在的结果是这样的 :( - kinza

AutoLayout 是一个难以满足的“野兽”，但这应该是被接受的答案。 - Morpheu5

我本想点赞的，但是我不能，因为我的声望值不够:/ @jonaszmclaren - kinza

这个话题的最佳答案。谢谢。 - Jeff

Answer 2

最好的方法是在这种情况下使用scrollView。如果您不想使用scrollView，则必须为最后一个按钮提供底部约束，并将该特定约束的优先级设置为低。它将在当前屏幕上（横向和纵向）正常工作，但当您转到小屏幕即4s或5时，自动布局的目的将失败。

- Vaibhav Parmar

Answer 3

如果您隐藏图像，它将仅对用户不可见，但屏幕上的空间将被图像使用。更好的方法是在方向更改为横向时将图像高度设置为0。 您可以创建图像高度约束的出口并根据方向进行更改。此方法称为方向更改之前。 您需要创建图像高度约束的出口。

@IBOutlet var heightConstraint : NSLayoutConstraint!


       override func willRotate(to toInterfaceOrientation: UIInterfaceOrientation, duration: TimeInterval)
            {
                if toInterfaceOrientation == .landscapeLeft || toInterfaceOrientation == .landscapeRight{
    // Imageview height constraint outlate
                    heightConstraint.constant = 0
                }
                else{
                    heightConstraint.constant = 100
                }
            }

- Hiren

---

在Storyboard中，ImageView的初始高度应该是多少？我应该使用哪种约束来控制高度？ - kinza

您可以根据需求设置初始高度。我在端口模式下将其设置为100，并在方向更改时将其更改为0。在Storybord中，您可以在任何控件上添加高度约束并设置其初始值的常量值。您只需要添加高度约束，并将其设为视图控制器中使用的输出线。 - Hiren

现在工作完美了。 非常感谢 :) - kinza

请注意，苹果已经废弃了 willRotateToInterfaceOrientation:duration: 方法。它应该被 viewWillTransitionToSize:withTransitionCoordinator: 方法所取代。 - Smartcat

此外，如果您正在使用Storyboard或XIB，请务必查看@jonaszmclaren的更好解决方案。 - Smartcat

Answer 4

isHidden仅仅改变视图的可见性，而不会将其从该位置移除。为解决这个问题，请创建一个标题视图高度约束的outlet，并在方向更改时将其更改为0。

例如：

headerViewHeightConstraint.constant = 0.0
self.view.layoutIfNeeded()

并在纵向模式下恢复高度。

headerViewHeightConstraint.constant = // height value which you want to set
self.view.layoutIfNeeded()

- Martin

Answer 5

另一个选择是将您的视图放置在堆栈视图中。然后隐藏headerImageView应该恢复未使用的空间。

- Alain T.