了解自动版式项目关系
自从Xcode 6中引入自动布局以来，它已经成为iOS UI设计海洋中每位开发人员的波塞冬三叉戟。 每个移动应用程序都通过“自动布局”和“自适应布局”进行设计。 我们都对自动版式了解很多。
那么，这个博客有什么新内容？ 你很无聊 ！！
等等，伙计们！
直到最近，我还是大力使用Interface Builder进行UI设计的开发人员之一。 因此，以编程方式创建和使用约束对我来说几乎是最少的。 当我开始以编程方式编写约束时，我经常迷惑于first item和second item之间的关系，即从一个UI组件到另一个UI组件的约束关系。 因此想到了记下我的观察结果。
让我们考虑以下设计：
为了在IB中进行设置，我们将要求View.Leading — Super View.Leading, View.Trailing — Super View.Trailing, View.Top — Super View.Top, View.Bottom — Super View.Bottom的最小约束。
让我们看看我们添加的约束。
我们不希望我们的约束无法通过“安全区域”布局，因此我们将它们与“安全区域”相关联放置，因此不要感到困惑。 即使我们从“视图”到“安全区域”设置了限制条件，也请仔细标记，理想情况下，第一项应该是“ View 但在某些限制条件下，我们发现第一个项目是“ Safe Area 。
为什么Xcode会这样做？ 🤦
好的，让我们将View设置为每种情况下属性检查器中的第一项，并查看更改。 只需反转第一个和第二个项目的trailing和trailing 。
在两种情况下标记常量的值都变为负数。
让我们离开IB并以编程方式放置约束，方法是从Purple View所有约束，然后查看其行为。
什么地方出了错？
要了解上述行为，我们需要了解以下概念并进行相应的研究。
iOS坐标系
参考上面的图表，随着我们向右移动，任何UI组件的x value都会增加，反之亦然。 当我们向下移动时，任何UI组件的y value都会增加，反之亦然。
自动布局第一项和第二项
所有“自动布局”关系都可以表示为：
再次调整我们的约束
如果我们重新构造约束，它们将如下所示：
最佳：
Purple View.topAnchor = Super View.topAnchor + 50
顶部锚点是一种垂直约束，它将与Y-Axis 。 因此，我们希望将“ Purple View顶部放置在“ Super Views顶部的下方，即，“ Purple View的y coordinates将比“ Super View的y coordinates高50点。 因此，我们在Super View顶部添加了50个点，因为在iOS坐标系中， y向下移动会增加。
底部：
Purple View.bottomAnchor = Super View.bottomAnchor - 50
这里的“ Purple Views底部位于“ Super Views底部的顶部，因此我们沿Y-Axis垂直向上移动，因此必须取反50点的值，因为在iOS坐标系y向上移动时y减小。
领导：
Purple View.leadingAnchor = Super View.leadingAnchor + 50
这里的“ Purple Views引线位于“ Super Views引线的右边，因此我们沿着X-Axis水平向右移动，因此必须添加50点的值，因为在iOS坐标系x增加向右移动。
尾随：
Purple View.trailingAnchor = Super View.trailingAnchor - 50
这里的Purple Views尾部在Super Views左侧，因此我们沿X-Axis水平向左移动，因此必须取50点的值，因为在iOS坐标系x左移会减少。
因此，正确的约束集将是：
现在还有一个问题，就是为什么Xcode在Interface Builder中进行设置时为什么会颠倒第一项和第二项，而没有像我们在代码中那样以可读的方式进行设置。 为此，我将引用Stack Conversation中的一项声明。
现在，另一端的约束通常用其他顺序的项目表示，因为您通常希望关系是相反的。 也就是说，您希望视图的顶部位于超级视图的顶部之下，但您希望视图的底部在超级视图的底部之上 。 因此，仅当您以其他顺序排列项目时，常数才为正
自动布局是我们所有人都喜欢的东西，如果我们深入了解我们在做什么，那将永远是最好的。 应该清楚地理解项目关系是自动版式的基本组成部分之一，以实现版式的有效性。 编码愉快。 👼🏻
您可以通过以下渠道与我联系，以获取任何查询，反馈或只是想进行讨论：
Twitter — @G_ABHISEK
领英
堆栈溢出
邮件
abhisekbunty94@gmail.com
为了立即连接
SkypeId — gabhisekbunty
请随时与您的其他开发人员分享。