带有旋转 UI 元素的自动布局

Posted 2023-03-15

【中文标题】带有旋转 UI 元素的自动布局

【英文标题】：AutoLayout with rotated UI Elements

【发布时间】：2013-03-11 16:56:55

【问题描述】：

我一直在自学 Auto Layout 使用代码（即避免使用 Interface Builder）。

我想用Auto Layout 设置一个视图。

它有 3 个水平的 UILabels 和一个垂直的。

Sort of like this.
---------------------------------------------
| ---  -----------------------------------  |
| | |  |                                 |  |
| | |  -----------------------------------  |
| | |  -----------------------------------  |
| | |  |                                 |  |
| | |  -----------------------------------  |
| | |  -----------------------------------  |
| | |  |                                 |  |
| ---  -----------------------------------  |
---------------------------------------------

左侧的标签向左旋转 90 度。

我只是不确定如何在旋转标签和非旋转标签之间应用自动布局？

这个可以吗？

height 会变成width，top 会变成left，等等...

【问题讨论】：

+1 好问题。如果您将“顶部”附加到 Superview（在 IB 中）并且您将视图旋转 90 度，那么约束是保持连接到旋转侧还是保持连接到新的“顶部”？如果是后者，您可以将视图放入 IB 中，在视图和右上角视图之间附加约束；然后在您的视图控制器中旋转。但我实际上并不知道这个问题的答案。

谢谢，我必须手动完成所有布局，但如果能得到答案并将所有布局放入自动布局中，那就太好了。

我想这一切都取决于约束（链接到框架）如何响应视图 CTM 的变化。我希望约束忽略 CTM 旋转。

【参考方案1】：

可能有一个“正确”的答案，但一个简单的解决方法是将旋转标签添加为非旋转视图的子视图，并使用这些视图进行布局。

更新：我只记得当视图应用了变换时，框架成为可能的最小边界框架*。除非我弄错了，否则这意味着框架正是您想要的，并且假设布局计算基于框架，它应该可以按预期工作。

* 当我上次使用转换视图时，旋转视图的框架是未定义的，但实验表明它是旋转视图的边界矩形。不确定现在是否已定义或明确允许/禁止。

更新 2：我检查了docs，他们仍然有强烈的警告，不要这样做：

警告：如果变换属性不是恒等变换，则该属性的值未定义，因此应被忽略。

【讨论】：

好的，不知道为什么我之前没有尝试过，但是我构建了一个小型测试项目广告，设置了主视图，就像我的问题中一样......效果很好。你说得对，AutoLayout“框架”实际上是旋转后视图的最小边界框。

我检查了文档，并用仍然存在的警告更新了我的答案。如果它有效，那就太好了，但每次有操作系统更新时都要仔细检查一下。