UIStackView started to be used after iOS9. It inherits UIView and is used to manage views within it, but it will not be rendered. According to the summary of my use in work, it can greatly improve the efficiency of interface development. Every iOS developer should be familiar with using UIStackView.

Go to the official account [iOS Development Stack] to learn more SwiftUI, iOS development related content.

This article will be divided into basic and advanced parts to explain UIStackView, so if you have used UIStackView to a certain extent, you can directly jump to the advanced part.

UIStackView basic knowledge

The main function of UIStackview is to manage the layout of views in an array of arrangedSubviews. There are three methods to manage an array: addArrangement SubView: – RemoveArrangement SubView: – insertArrangedSubview:atIndex:

Layout of UIStackView arrangedSubview mainly uses the attributes UILayoutConstraintAxis UIStackViewDistribution UIStackViewAlignment spacing.

  1. UILayoutConstraintAxis – determines the orientation of arrangedSubviews, Horizontal or Vertical

  2. UIStackViewDistribution – arrangedSubviews layout in arrangement direction

    1. The space of the UIStackViewDistributionFill UIStackView fill, For UIViews (UILabel, UIButton, UIImageView, and UIControl) with intrinsical content size, set the content in the Size Inspector Property determines which view’s contrinsicSize should be satisfied first. If the Property is the same, the first one will be selected by default.
    2. UIStackViewDistributionFillEqually arrangedSubviews split UIStackView orientation in addition to the spacing of the space
    3. Each arrangedSubview UIStackViewDistributionFillProportionally proportional distribution of size, according to each arrangedSubview intrinsic content in proportion to the size
    4. UIStackViewDistributionEqualSpacing when arrangedSubviews can’t fill the blank area will be equally, without automatic stretch Hugging Property lower view; If arrangedSubviews cannot be placed, the view content with high compression resistance priority will be guaranteed to be fully displayed, and the first view will be guaranteed by default when priority is the same.
    5. The spacing between the equal UIStackViewDistributionEqualCentering view center. When spacing is too large to allow all views to be displayed properly, views with higher compression resistance priority are guaranteed to be fully displayed, and views with the same priority are guaranteed to be the first view by default.

  3. Uistackview Arrangment – Arrangement of subviews perpendicular to the arrangement direction

    1. UIStackViewAlignmentFill is completely filled
    2. UIStackViewAlignmentLeading/UIStackViewAlignmentTop depend on the right
    3. UIStackViewAlignmentTrailing UIStackViewAlignmentBottom/down/left
    4. Text UIStackViewAlignmentFirstBaseline UIStackViewAlignmentLastBaseline/on/under the baseline

  4. Spacing – arrangedSubview spacing. The distance to UIStackViewDistributionFillxxx is accurate, For UIStackViewDistributionEqualSpacing, UIStackViewDistributionEqualCentering is minimum distance, using negative view will be covered

After mastering the basic knowledge of the above basic can get started using UIStackView.

UIStackView advanced knowledge

Q1. Can constraints be used on child Views in UIStackView? A1. UIStackView determines the layout of the inside arrangedSubview based on constraints. When assigning constraints to a certain arrangedSubview manually, the specified constraints will be satisfied first.

Q2. UIStackView. ArrangedViews and UIStackView subViews relationship? A2. ArragedViews is a subset of subViews

  1. UIStackView addSubview is not added to arrangedSubviews;
  2. When adding views to arrangedSubviews, views are automatically added to subviews
  3. Removing a View that is only in a Subview and not in an ArrangedView does not affect the Arrangement View
  4. When a view is in subviews and Arrangedviews, when it is removed from Subviews, it is automatically removed from ArragedViews, and vice versa

Q3. UIStackView set background color why not display? A3. UIStackView is a subclass of UIView, but it is not rendered, so setting the background color does not show anything, but setting rounded corners does.

Q4. UIStackView how to set the distance between a child view and the back view? A4. After iOS11 UIStackView added method can set up new setCustomSpacing: afterView

Go to the official account [iOS Development Stack] to learn more SwiftUI, iOS development related content.

The article was first posted on my blog