固有内容尺寸视图
以下的例子展示了Auto Layout如何与带有固有内容尺寸(intrinsic content size)的视图一起使用。总的来说,intrinsic content size简化了排版,减少了你需要的约束(constraints)。然而,使用intrinsic content size通常需要设置view的content-hugging(译者:hug意为紧身,即使得控件的尺寸不大于内容的尺寸)和content-resistance(译者:resistance意为抵抗,即使得控件的尺寸不小于内容的尺寸)(CHCR)参数。这些参数可能导致额外的复杂度。
参考Auto Layout Cookbook工程来查看相关源码。
简单的Label和Text Field
这个例子将一个简单的label和text field进行排版。例子中,label的宽度取决于它的text参数的长度,而text field将自动伸缩来填满剩下的空间。
由于这个例子使用了view的Intrinsic content size,你只需要五个约束来设定一个独一无二的版式。然而,你必须保证你设置了正确的CHCR参数来得到正确的尺寸调整行为。
更多有关intrinsic content size和CHCR参数的信息,请参阅Intrinsic Content Size
视图和约束
在Interface Builder中,拉出一个label和一个text field。设置label的text和text field的placeholder,并设置约束为如下所示:
- Name Label.Leading = Superview.LeadingMargin
- Name Text Field.Trailing = Superview.TrailingMargin
- Name Text Field.Leading = Name Label.Trailing + Standard
- Name Text Field.Top = Top Layout Guide.Bottom + 20.0
- Name label.Baseline = Name Text Field.Baseline
属性
要使得text field拉伸并填充剩余的空间,它的content hugging的优先级必须低于label的优先级。默认情况下,interface builder会设置label和text field的content hugging分别为251和250。你可以在size inspector中确认。
Name | Horizontal hugging | Vertical hugging | Horizontal resistance | Vertical resistance |
---|---|---|---|---|
Name Label | 251 | 251 | 750 | 750 |
Name Text Field | 250 | 250 | 750 | 750 |
说明
注意,这个排版只用了两个约束(4和5)来定义垂直版式,3个约束(1,2,3)来定义水平版式。根据Creating Nonambiguous, Satisfiable Layouts一文的经验,我们对每个视图需要设置两个水平约束和两个垂直约束。然而,label和text field的intrinsic content size提供了他们的高度和Label的宽度,使得这三个约束不再被需要。
这个版式使用了简化了的假设,那就是text field总是比label的文字来的高。所以这里用了text field的高度来定义(label和text field)距离top layout guide的高度。由于两个控件都是用来显示文字的,这个例子使用了基线(baseline)来对齐它们。
在水平方向上,你依然需要定义哪个视图需要拉伸以便填满剩余的空间。你可以通过视图的CHCR参数来修改这些。在本例中,interface builder应该已经设置label的horizontal和vertical hugging参数为251。由于这个值比text feild的默认值250要大,所以text field会拉伸并填满其余的空间。
注意
如果显示区域对控件来说太小了的话,你必须同时修改compression resistance的值。这个参数定义了空间不够时哪个视图应该被截短。在这个例子里,修改compression resistance的工作留给读者作为练习。如果name label的文字够长或者字体够大,那么就不会有足够的空间,所以会导致不确定的版式。这时,系统会选择违反一个约束,text field或者label的其中一个会被截断。
理想情况下,你会希望新建一个从来都不会比可用空间大的版式,并且按需为compact size classes建立另外一个版式。然而,如果你要为视图增加多语言和动态类型支持的话,你就很难预测每一行到底会多大。设置compression resistance是一个很好的以防万一的值。