UIStackView 使用

UIStackView 只支持iOS9之后的版本,然而现在应用一般支持到iOS7,FDStackView,It will automatically replace the symbol for UIStackView into FDStackView at runtime before iOS9.

例子
iOS 9: UIStackView入门
UIStackView教程

iOS9新特性-UIStackView

简介

Stack View最有用的就是它会自动为每个subview创建和添加Auto Layout constraints。当然你可以控制subview的大小和位置。可以通过选项配置subview的大小、排布以及彼此间的间距。

布局内容

Axis表示Stack View的subview是水平排布还是垂直排布。

Alignment控制subview对齐方式。alignment 属性指定了子视图在布局方向上的对齐方式,如果值是 Fill 则会调整子视图以适应空间变化,其他的值不会改变视图的大小。有效的值包含:Fill、 Leading、 Top、 FirstBaseline、 Center、 Trailing、 Bottom、 LastBaseline。

Distribution 分布

Distribution 属性定义了 subviews 的分布方式,可以赋值的5个枚举值可以分为两组: Fill 组 和 Spacing 组。

Fill 组用来调整 subviews 的大小,同时结合 spacing 属性来确定 subviews 之间的间距。

  • Fill: subviews 将会根据自己内容的内容阻力(content resistance)或者内容吸附优先级(hugging priority)进行动态拉伸,如果没有设置该值,subviews 中的一个子视图将会用来填充剩余可用空间。

  • FillEqually: 忽略其他的约束,subviews 将会在设置的布局方向上等宽或等高排列。

  • FillProportionally: subviews 将会根据自己的原始大小做适当的布局调整。

Spacing 组指定了 subviews 在布局方向上的间距填充方式,当 subviews 不满足布局条件或有不明确的的 Auto Layout 设置时,该类型的值就会结合相应的压缩阻力(compression resistance) 来改变 subviews 的大小。

  • EqualSpacing: subviews 等间距排列

  • EqualCentering: 在布局方向上居中的 subviews 等间距排列

把术语简化一下,你可这样理解:Alignment 用于控制X 和 Y值,而Distribution 用于控制高度和宽度。另两个值都会影响对齐。如果选中Baseline Relative将根据subview的基线调整垂直间距。

另一个需要记住的是,Stack View会被当成Container View。所以它是一个不会被渲染的UIView子类。它不像其他UIView子类一样,会被渲染到屏幕上。这也意味着设置其backgroundColor属性或重载drawRect:方法都不会产生任何效果

subView和arrangedSubView

开始使用Stack View前,我们先看一下它的属性subViewsarrangedSubvies属性的不同。
-->arrangedSubviews数组是subviews属性的子集。

如果你想添加一个subview给Stack View管理,你应该调用addArrangedSubview:或insertArrangedSubview:atIndex:

要移除Stack View管理的subview,需要调用removeArrangedSubview:和removeFromSuperview。

移除arrangedSubview只是确保Stack View不再管理其约束,而非从视图层次结构中删除,理解这一点非常重要。

举例:

打开Main.Storyboard选择上面的Stack View。
对Attributes Inspector作如下改变:

Alignment 设为 Center
Distribution 设为 Equal Spacing
Spacing 设为 30

这告诉Stack View为subview添加约束,使其垂直居中并沿Stack View的轴线对称,然后为subview设置边距30。

如果subview大小和Stack View内容区不相符,将根据compression resistance priorities对subview进行拉伸或压缩。在运行时给Stack View添加subview也同样会如此。

布局有任何歧义Stack View都会根据subview在arrangedSubviews中index一步步回退去调整subview的大小,直至其刚好适应Stack View的大小。

图示

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容