UIStackView从入门到进阶

2,232 阅读3分钟

UIStackView在iOS9之后开始使用,继承自UIView,用来管理在它内部的views,但是并不会被渲染出来,经过我在工作中的使用总结,它确实可以很大程度提高界面开发效率,每一个iOS开发者都应该熟练掌握UIStackView的使用。

到公众号【iOS开发栈】学习更多SwiftUI、iOS开发相关内容。

本文将分为基础和进阶两部分来讲解UIStackView,因此如果已经一定程度的使用过UIStackView,那么可以直接跳转到进阶部分。

UIStackView基础入门知识

UIStackview的主要作用是管理arrangedSubviews数组中的view的布局,管理数组的有三个方法 - addArrangedSubview: - removeArrangedSubview: - insertArrangedSubview:atIndex:

UIStackView中arrangedSubview的布局主要是使用UILayoutConstraintAxis UIStackViewDistribution UIStackViewAlignment spacing 几个属性。

  1. UILayoutConstraintAxis - 确定arrangedSubviews的排列方向,分为Horizontal和Vertical

  2. UIStackViewDistribution - arrangedSubviews在排列方向的布局方式

    1. UIStackViewDistributionFill 把UIStackView的空间填充满,对于有intrinsic content size的UIView(UILabel、UIButton、UIImageView、UIControl)需要通过设置Size Inspector中的Content Hugging Property来决定优先满足哪个view的contrinsicSize,如果property相同则会默认选择第一个。
    2. UIStackViewDistributionFillEqually arrangedSubviews平分UIStackView 排列方向上除了spacing的空间
    3. UIStackViewDistributionFillProportionally 按比例分配每个arrangedSubview所占大小,按照每个arrangedSubview的intrinsic content size的比例
    4. UIStackViewDistributionEqualSpacing 当arrangedSubviews不能填满时,空白区域会平均分配,而不会自动拉伸Hugging Property较低的view;如果arrangedSubviews放不开时,会优先保证compression resistance priority较高的view内容能够完全展示,priority相同时会默认保证第一个view。
    5. UIStackViewDistributionEqualCentering view中心之间的spacing相等。当spacing值过大,无法满足所有view都能正常展示,会优先保证compression resistance priority较高的view内容能够完全展示,priority相同时会默认保证第一个view。
  3. UIStackViewAlignment - arrangedSubviews垂直于排列方向的布局方式

    1. UIStackViewAlignmentFill 完全填充
    2. UIStackViewAlignmentLeading/UIStackViewAlignmentTop 靠上/右
    3. UIStackViewAlignmentTrailing/UIStackViewAlignmentBottom 靠下/左
    4. UIStackViewAlignmentFirstBaseline/UIStackViewAlignmentLastBaseline 文字基线 下/上
  4. spacing - arrangedSubview的间距。对于UIStackViewDistributionFillxxx就是准确的距离,对于UIStackViewDistributionEqualSpacing、UIStackViewDistributionEqualCentering 是最小距离,使用负数view会覆盖

掌握了上面的基础知识后基本就可以上手使用UIStackView了。

UIStackView进阶知识

Q1. 在UIStackView中可以对子view使用约束吗? A1. UIStackView是基于约束来确定里面arrangedSubview的布局的,手动给某一个arrangedSubview指定约束时,会优先满足指定的约束,不过因为系统也会根据我们设置的属性添加约束,所以要当心会出现约束冲突。

Q2. UIStackView.arrangedViews 和 UIStackView.subViews的关系? A2. arragedViews是subViews的子集

  1. UIStackView addSubview 并不会添加到arrangedSubviews中;
  2. 当向arrangedSubviews中添加view时会自动添加到subviews中
  3. 把一个只在subview而不在arrangedview中的view移除时也不会影响到arrangedview
  4. 一个view既在subviews中又在arrangedviews中时,当把它从subviews中移除,也会自动从arragedviews中移除,反之则不然

Q3. UIStackView设置了背景色为什么显示不出来? A3. UIStackView虽然是UIView的子类,但是它并不会被渲染,所以设置背景色并没有什么显示,但是设置圆角是有作用的。

Q4. UIStackView怎么设置某一个子view和后面view的距离? A4. 在iOS11之后UIStackView新加了方法可以设置setCustomSpacing:afterView

到公众号【iOS开发栈】学习更多SwiftUI、iOS开发相关内容。

文章首发在我的博客