为啥更换模拟器后我的 VC 会移位？自动布局

Posted 2023-02-26

【中文标题】为啥更换模拟器后我的 VC 会移位？自动布局

【英文标题】：Why is my VC displaced after changing the Simulator? AutoLayout为什么更换模拟器后我的 VC 会移位？自动布局

【发布时间】：2020-10-21 19:42:31

【问题描述】：

这是我用来为我的视图元素设置自动布局约束的代码：

TimeLabel.translatesAutoresizingMaskIntoConstraints = false
               
    NSLayoutConstraint.activate([
               TimeLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor),
               TimeLabel.topAnchor.constraint(equalTo: view.topAnchor, constant: -30),
               TimeLabel.widthAnchor.constraint(equalToConstant: 300),
               TimeLabel.heightAnchor.constraint(equalToConstant: 300)
    
    ])

但它不起作用！当我将模拟器从 iPhone 11 换成 iPhone 11 Pro 时，我的一些元素看不到，因为整个 VC 被移位了！

我能做什么？ 提前致谢

【问题讨论】：

您需要提供更多细节。在您发布的代码中，您已将 TimeLabel Top 设置为视图顶部 的 30 点。这就是你想要的吗？

另外，iPhone 11 视图的高度为 896 ... iPhone 11 Pro 视图的高度为 812。您是否将 UI 元素布局为总共 896-pts 高度?

好的，谢谢你，但你能说得更具体一点吗？

更具体？你没有回答我的任何一个问题。如果不知道你在做什么，或者你想做什么，我无法更具体。

好吧，我是这个领域的新手，目前我正在开发我的第一个应用程序，当我使用 iPhone 11 时，所有视图元素的位置都很好。就像TimeLabel与我在楼上发布的代码一起放置在那里。但是当我更换设备时，元素会移位，我的一些元素实际上是不可见的！所以我需要的是关于我可以对我的代码进行哪些更改以同时定位它的知识。等于我使用的设备

【参考方案1】：

特别是因为正如你所说，“在这个领域真的很新” - 我强烈建议你花一些时间学习关于自动布局和适应屏幕尺寸。

从 Apple 的文档开始，然后搜索教程……你会发现很多。

但是，为了帮助您开始理解，请查看这两个示例（您需要在新的浏览器选项卡/窗口中打开它们以更好地查看）：

示例 1

如您所见，我为每个 UI 元素设置了高度约束，然后从顶部开始，每个元素之间有 40 磅的垂直空间约束。

在 iPhone 11 上看起来不错，但由于 11 Pro 更短，第四个标签已被推离屏幕底部。

示例 2

布局看起来非常相似，预计我将 UI 元素嵌入到 UIStackView 中。然后我约束堆栈视图顶部和底部，并将其Distribution 属性设置为Equal Spacing。

现在，随着更短的 11 Pro，元素之间的间距减小了，我们仍然可以看到 Fourth Label。

---

它的意义远不止于此。例如，当我们旋转设备时会发生什么？当我们在 12.9 英寸 iPad Pro 上运行时会发生什么？

但是，也许，希望这可以给你一个起点。

【讨论】：

好的，所以最好的方法是使用 StackView 而不是自动布局？我真的很想找到关于 autoLayouts 的好教程，但它们都在使用 Storyboard，我想以编程方式学习它，这会让它变得更难，但我相信我会完成:)

@EasyChris - “做我想做的最好的方法是使用 StackView 而不是自动布局？” --- 不。堆栈视图是自动布局的一部分。这只是管理不同屏幕尺寸的一种方式的简单示例。浏览十几个关于自动布局的教程。他们是否使用 Storyboard 都没关系 - 想法是一样的。了解自动布局/特征变化/使用约束乘数作为百分比等。一旦您熟悉了它的工作原理，就可以直接在代码中而不是 Storyboard 中实现。但你得先学会它。