自动布局如何在具有3个等宽视图的视图中隐藏1个视图

Question

自动布局如何在具有3个等宽视图的视图中隐藏1个视图

iosswiftautolayout

7

目前我有一个视图，里面包含3个子视图（该视图钉在父视图的前缘和后缘）。

当前这3个子视图如下所示：

然而，在某些情况下，我希望隐藏靛蓝色的视图，但仍保持最后2个视图相同的宽度，如下所示：

如何使用自动布局实现此效果？或者如何使用IBOutlets来约束实现此效果？

- Bob

你尝试过创建IBOutlet，然后使用.hidden属性吗？ - Matthew Bradshaw

@MatthewBradshaw IBOutlet会连接到什么？ - Bob

通过控制拖动到助手编辑器中，将您想要以编程方式操作的视图连接到IBOutlet。然后操纵该输出口。.hidden属性是一个布尔值。请查看此教程https://developer.apple.com/library/ios/referencelibrary/GettingStarted/DevelopiOSAppsSwift/Lesson3.html - Matthew Bradshaw

1

你尝试过使用 UIStackView 吗？ - tktsubota

@tktsubota，我也支持iOS 8，所以这不是一个选择。Stackview会使这变得更容易。 - Bob

3个回答

2

很简单，您可以为3个视图创建等宽约束A，将其优先级设置为998，然后为它们创建另一个单一宽度约束B1、B2、B3，将其优先级设置为997。如果要隐藏任何一个3个视图中的视图，请将B约束的常量设置为0，并将其优先级提高到999，然后调用self.view.layoutIfNeeded，视图将隐藏，其他视图将缩放。

测试约束是灰色视图的宽度约束：

- Tj3n

单宽约束是什么意思？ - Bob

点击它后，按下下面的“固定”按钮，然后检查“宽度”，将其优先级设置为997，虽然您必须为其创建属性以在代码中稍后更改优先级。 - Tj3n

0

如果始终可以隐藏indigo视图，您应通过添加以下约束条件来解决问题：

Indigo视图：leading至superview + trailing至purpleView +宽度约束

Purple视图：与grayView相同的宽度

Gray视图：leading至purpleView + trailing至superview

它应该看起来像这样：

如果您更改indigoView的宽度属性，所有内容都应该正确地跟随。

希望这能帮到您。

- Damien Ballenghien

但是Indigo视图没有指定的宽度约束条件，因此我该如何以编程方式隐藏它？ - Bob

你只需要将你的约束作为IBOutlet链接，并将yourConstraint.constant设置为0，将indigoView.frame.size.width也设置为0。通过这种方式，通过设置indigoView的宽度，您将拥有其他使用剩余宽度的视图。 - Damien Ballenghien

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Fujia · Accepted Answer

如果部署目标是iOS9或更高版本，则建议使用UIStackView作为封装视图。在UIStackView中的任何视图上设置isHidden为true，不仅会使该视图隐藏，还会使堆栈视图重新组织所有非隐藏视图以填补被隐藏视图占用的空间。通过调整UIStackView上的distribution可以调整此行为。

Tj3n的答案是可行的，但它有一个缺点，就是您必须在代码中使用神奇数字并设置约束属性，并且在代码和IB中都要这样做。

在我看来，更好的解决方案是在IB中设置所有约束条件，并设置不同的优先级，在代码中激活/取消它们。请尝试以下操作：

像之前一样设置前导/后续约束。
为所有三个视图设置具有high优先级的等宽约束。
为所有三个视图设置具有required优先级的0宽度约束，但在IB中保留它们处于未激活状态。将它们与IBOutlet在代码中连接，就像连接视图一样。
激活任何0宽度约束以折叠所需的视图，稍后取消激活以展开。

请注意，只有完成1和2，您就可以实现等宽视图布局。通过完成3和4，您可以选择性地折叠/展开任何视图。