UIView 使用约束自动布局居中和调整大小

Posted 2023-03-15

【中文标题】UIView 使用约束自动布局居中和调整大小

【英文标题】：UIView centering and resizing with constraints autolayout

【发布时间】：2014-07-18 11:11:11

【问题描述】：

我正在尝试将我的 iPhone 应用程序转换为通用应用程序，但我真的无法弄清楚这些限制。尝试阅读有关自动布局的整章，但我仍然无法管理它。

所以在我的视图控制器中有 2 个UIViews，它们是一个正方形。如果它是纵向的，正方形会很好地显示出来。但是当我把 iPad 变成横向时，正方形变成了矩形。真的什么都试过了。

还有一个问题，如果我设法将它们保持在中心和东西上，它们应该调整到更小的尺寸。认为这也可以通过自动布局实现。

这是我的UIViews 的基本设置：

编辑新建议：

所以这几乎是完美的，但它应该是一个正方形。有什么想法吗？

【问题讨论】：

如果显示/解释你的限制，别人帮助你会更好

那我再补充一些。我把它们都删除了，因为它们都不好，乱七八糟。

【参考方案1】：

您需要以下约束：

垂直：

顶部方形固定到带有插图 10 的超级视图 顶部正方形固定到底部正方形，插入 10 底部方形固定到带有插图 10 的超级视图

水平方向：

顶部正方形固定到左边缘，插入 10（低优先级） 顶部正方形固定到右边缘，插入 10（低优先级） 在超级视图中居中的顶部正方形 底部正方形的左边缘固定到顶部正方形的左边缘

尺寸：

顶部正方形纵横比为 1:1（从视图中按住 ctrl 键拖动到自身即可实现此目的） 底部正方形的宽度和高度固定到顶部正方形

这将使您的两个正方形尽可能多地填充垂直空间，同时不会重叠或超出视图。

【讨论】：

插图 10 是什么意思？那是与erge的间距吗？因为在那种情况下，在我的情况下，插图应该超过 10，因为我希望它在屏幕上居中。我已经尝试过了，但出现错误。我会编辑我的帖子。

今天又试了一次，没有错误了。但它们并没有变坏。所以几乎完美。

插图存在，但优先级较低，以确保它不会超出屏幕边缘。您是否在控制台中看到任何布局警告？

查看您已设置的内容和所看到的内容，看起来这些边缘约束是问题所在 - 它们需要低优先级和低数量。不要担心硬编码“正确的”数字，这就是导致您的问题的原因，因为它从纵向到横向都不同。

哦，我忘了把它添加到我的答案中（它在我制作的示例项目中！）做得很好！

【参考方案2】：

关于自动布局，基本的事情是可视化视图如何变化，并找出需要附加的所有内容，视图布局更改需要修改的所有内容。

确保固定值在布局中标记为固定 确保所有的约束都由你设置。自动设置 约束可能无法按预期工作

你必须阅读这篇优秀的tutorial by Matthijs Hollemans