自动布局理解乘数

13
我对乘数存在问题,无法理解其工作原理。例如,我有一个视图具有6:1的乘数(相对于SuperView.Leading),如下所示。 SuperView.Leading with 6:1 multiplier picture 当我将乘数更改为2:1时,它看起来像下面的图片。 enter image description here 我的问题是,在6:1的关系中,6和1是什么意思。同样地,在2:1的关系中,2和1是什么意思?类似地考虑您有三个视图,如下图所示。在超级视图和子视图之间总共有4个空白区域。如何表达每个空白区域必须是SuperView.Width / 6(每个空白宽度必须相等)? enter image description here

提前感谢。


为了更好的理解,请直接使用0.5代替1:2。 - Anshad Rasheed
1
如果你查看苹果文档,会有关于自动布局属性的每一个细节...你需要先检查那个。 - Bhavin Bhadani
4个回答

16
使用自动布局时,特别是在使用比例布局时,您必须使用乘数。
我需要在这里解释一些数学知识。 我们知道直线方程。
Y = Mx + C
在上述方程中,假设M是您的乘数,C是您的常量。
因此,假设您有一个父视图(在iPhone 6s Plus的情况下)大小为414(宽)x736(高)。在该视图上,假设您创建了子视图。
现在,如果您想要子视图的大小恰好是父视图大小的一半,则只需从子视图拖动两个约束到父视图即可。(即等宽度和等高度)
请参见此图像。

enter image description here

显然,现在你会遇到一个错误,就像我现在遇到的一样。(见下图)

enter image description here

现在依次点击两个约束条件,并将乘数设置为0.5。然后使用上面的直线方程式。 这里0.5表示您希望子视图的宽度=父视图宽度/2.0,即207像素。
换句话说,您也可以提供207:414的乘数。
即子视图宽度=(0.5 * 414即父视图宽度)+常量即零
最终得到子视图宽度=207像素
类似地,对于子视图的高度进行操作。提供乘数0.5或368:736。
完成所有操作后,不要忘记单击子视图并更新框架。
这样常量和乘数就会起作用了。

2
非常感谢!还有一点小提示:0.5 * 414 = 207 :) - David.K

4
在我的例子中,乘数是1:2=0.5。
红色视图的高度比其父视图大0.5倍。 enter image description here

4
当涉及到乘数时,它取决于你正在处理的约束条件。你有一个与父视图前导边距相连的视图前导约束。当常量为0时,这会给你一个8点间隙。当你改变乘数时,你将影响到这个间隙。这就是为什么当你做2:1时,你会看到它向右移动8个点。本质上是将原始的8点间隙乘以2。如果你做1:2,它将从8点变成4点,本质上将原始的8点边距除以2。
现在当你看Adrians的例子时,他只把它乘以1:2,那么这怎么能让它变成整个屏幕的一半呢?这是因为他在高度约束上这样做了。视图最初是父视图的全尺寸,但当他将其乘以1:2时,他表明他希望它成为其原始高度的1/2。给你那个最终结果。
所以重要的是要理解乘数可能似乎根据情况而有所不同,但这是因为它取决于你正在处理的约束条件。
这里有一个更好的答案详细介绍了这个问题: Understanding multiplier in auto layout to use relative positioning 链接详细介绍了如果你想要使前导边缘为10%,后缘为90%,则需要根据后缘设置两个约束。
将后面的约束乘以0.9,前导约束乘以0.1。
关于你关于等间隔视图的问题,你应该使用堆栈视图。它们是为这种情况而设计的,所以你不必处理所有的约束条件。你只需要为堆栈视图设置约束并相应地配置即可。

4

乘数用于创建比例约束。自动布局计算第一个项目的属性为第二个项目的属性与此乘数的乘积。任何不为1的值都会创建比例约束。

在您的情况下,6:1表示乘数为6/1 = 6。这意味着

view.leading  = Superview.leadingMargin*6

:替换为/ - 您将理解其含义。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接