版本记录
| 版本号 | 时间 |
|---|---|
| V1.0 | 2018.04.27 |
前言
iOS中的视图加载可以有两种方式，一种是通过xib加载，另外一种就是通过纯代码加载。它们各有优点和好处，xib比较直观简单，代码比较灵活但是看着很多很乱，上一家公司主要风格就是用纯代码，这一家用的就是xib用的比较多。这几篇我们就详细的介绍一个xib相关知识。感兴趣的可以看上面写的几篇。
1. xib相关（一） —— 基本知识（一）
2. xib相关（二） —— 文件冲突问题（一）
3. xib相关（三） —— xib右侧标签介绍（一）
4. xib相关（四） —— 连线问题（一）
5. xib相关（五） —— 利用layout进行约束之界面（一）
6. xib相关（六） —— 利用layout进行约束之说明和注意事项（二）
7. xib相关（七） —— Storyboard中的segue （一）
8. xib相关（八） —— Size Classes（一）
9. xib相关（九） —— 几个IB修饰符（一）
10. xib相关（十） —— xib的国际化（一）
11. xib相关（十一） —— xib的高冷用法之修改视图的圆角半径、边框宽度和颜色（一）
12. xib相关（十二） —— UIStackView之基本介绍（一）
API
下面看一下UIStackView的API文档，这些其实在上一篇多少都有所介绍。
#import <UIKit/UIView.h>
/* Distribution—the layout along the stacking axis.
All UIStackViewDistribution enum values fit first and last arranged subviews tightly to the container,
and except for UIStackViewDistributionFillEqually, fit all items to intrinsicContentSize when possible.
*/
typedef NS_ENUM(NSInteger, UIStackViewDistribution) {
/* When items do not fit (overflow) or fill (underflow) the space available
adjustments occur according to compressionResistance or hugging
priorities of items, or when that is ambiguous, according to arrangement
order.
*/
UIStackViewDistributionFill = 0,
/* Items are all the same size.
When space allows, this will be the size of the item with the largest
intrinsicContentSize (along the axis of the stack).
Overflow or underflow adjustments are distributed equally among the items.
*/
UIStackViewDistributionFillEqually,
/* Overflow or underflow adjustments are distributed among the items proportional
to their intrinsicContentSizes.
*/
UIStackViewDistributionFillProportionally,
/* Additional underflow spacing is divided equally in the spaces between the items.
Overflow squeezing is controlled by compressionResistance priorities followed by
arrangement order.
*/
UIStackViewDistributionEqualSpacing,
/* Equal center-to-center spacing of the items is maintained as much
as possible while still maintaining a minimum edge-to-edge spacing within the
allowed area.
Additional underflow spacing is divided equally in the spacing. Overflow
squeezing is distributed first according to compressionResistance priorities
of items, then according to subview order while maintaining the configured
(edge-to-edge) spacing as a minimum.
*/
UIStackViewDistributionEqualCentering,
} NS_ENUM_AVAILABLE_IOS(9_0);
/* Alignment—the layout transverse to the stacking axis.
*/
typedef NS_ENUM(NSInteger, UIStackViewAlignment) {
/* Align the leading and trailing edges of vertically stacked items
or the top and bottom edges of horizontally stacked items tightly to the container.
*/
UIStackViewAlignmentFill,
/* Align the leading edges of vertically stacked items
or the top edges of horizontally stacked items tightly to the relevant edge
of the container
*/
UIStackViewAlignmentLeading,
UIStackViewAlignmentTop = UIStackViewAlignmentLeading,
UIStackViewAlignmentFirstBaseline, // Valid for horizontal axis only
/* Center the items in a vertical stack horizontally
or the items in a horizontal stack vertically
*/
UIStackViewAlignmentCenter,
/* Align the trailing edges of vertically stacked items
or the bottom edges of horizontally stacked items tightly to the relevant
edge of the container
*/
UIStackViewAlignmentTrailing,
UIStackViewAlignmentBottom = UIStackViewAlignmentTrailing,
UIStackViewAlignmentLastBaseline, // Valid for horizontal axis only
} NS_ENUM_AVAILABLE_IOS(9_0);
/* Used when setting custom spacing after an arranged subview to indicate reverting to
the value specified by the spacing property.
See -setCustomSpacing:afterView:, -customSpacingAfterView:
*/
static const CGFloat UIStackViewSpacingUseDefault API_AVAILABLE(ios(11.0),tvos(11.0)) = FLT_MAX;
/* Used when setting custom spacing after an arranged subview to request the system
spacing to the neighboring view.
Also used as a token for the spacing property to request system spacing between
arranged subviews.
See spacing, -setCustomSpacing:afterView:, -customSpacingAfterView:
*/
static const CGFloat UIStackViewSpacingUseSystem API_AVAILABLE(ios(11.0),tvos(11.0)) = FLT_MIN;
/* UIStackView is a non-rendering subclass of UIView, intended for managing layout of its subviews.
You may not override +[UIStackView layerClass], and -drawLayer:inContext: will not be sent to
UIStackView.
UIStackView arranges its subviews in its arrangedSubviews list in the order of
that list along a vertical or horizontal axis, with exact arrangement determined
by the distribution, alignment, and spacing properties.
The layout will update automatically when arrangedSubviews list changes
due to adding, removing, or inserting arrangedSubviews, and also when
views in the arrangedSubviews list change their hidden property.
A horizontal UIStackView will return its tallest view for -viewForFirst/LastBaselineLayout,
or if that is another stack view, then the relevant viewForFirst/LastBaselineLayout from that
stack view.
A vertical UIStackView will return its first view for -viewForFirstBaselineLayout and its
last view for -viewForLastBaselineLayout, or if that is another stack view, then the relevant
viewForFirst/LastBaselineLayout from that stack view.
*/
NS_ASSUME_NONNULL_BEGIN
NS_CLASS_AVAILABLE_IOS(9_0)
@interface UIStackView : UIView
- (instancetype)initWithFrame:(CGRect)frame NS_DESIGNATED_INITIALIZER;
- (instancetype)initWithCoder:(NSCoder *)coder NS_DESIGNATED_INITIALIZER;
/* UIStackView enforces that all views in the arrangedSubviews list
must be subviews of the UIStackView.
Thus, when a view is added to the arrangedSubviews, UIStackView
adds it as a subview if it isn't already. And when a view in a
UIStackView's arrangedSubviews list receives -removeFromSuperview
it is also removed from the arrangedSubviews.
Please note that this is a convenience initializer and cannot be overridden in Swift.
*/
- (instancetype)initWithArrangedSubviews:(NSArray<__kindof UIView *> *)views; // Adds views as subviews of the receiver.
@property(nonatomic,readonly,copy) NSArray<__kindof UIView *> *arrangedSubviews;
/* Add a view to the end of the arrangedSubviews list.
Maintains the rule that the arrangedSubviews list is a subset of the
subviews list by adding the view as a subview of the receiver if
necessary.
Does not affect the subview ordering if view is already a subview
of the receiver.
*/
- (void)addArrangedSubview:(UIView *)view;
/* Removes a subview from the list of arranged subviews without removing it as
a subview of the receiver.
To remove the view as a subview, send it -removeFromSuperview as usual;
the relevant UIStackView will remove it from its arrangedSubviews list
automatically.
*/
- (void)removeArrangedSubview:(UIView *)view;
/*
Adds the view as a subview of the container if it isn't already.
Updates the stack index (but not the subview index) of the
arranged subview if it's already in the arrangedSubviews list.
*/
- (void)insertArrangedSubview:(UIView *)view atIndex:(NSUInteger)stackIndex;
/* A stack with a horizontal axis is a row of arrangedSubviews,
and a stack with a vertical axis is a column of arrangedSubviews.
*/
@property(nonatomic) UILayoutConstraintAxis axis;
/* The layout of the arrangedSubviews along the axis
*/
@property(nonatomic) UIStackViewDistribution distribution;
/* The layout of the arrangedSubviews transverse to the axis;
e.g., leading/trailing edges in a vertical stack
*/
@property(nonatomic) UIStackViewAlignment alignment;
/* Spacing between adjacent edges of arrangedSubviews.
Used as a strict spacing for the Fill distributions, and
as a minimum spacing for the EqualCentering and EqualSpacing
distributions. Use negative values to allow overlap.
On iOS 11.0 or later, use UIStackViewSpacingUseSystem (Swift: UIStackView.spacingUseSystem)
to get a system standard spacing value. Setting spacing to UIStackViewSpacingUseDefault
(Swift: UIStackView.spacingUseDefault) will result in a spacing of 0.
System spacing between views depends on the views involved, and may vary across the
stack view.
In vertical stack views with baselineRelativeArrangement == YES, the spacing between
text-containing views (such as UILabels) will depend on the fonts involved.
*/
@property(nonatomic) CGFloat spacing;
/* Set and get custom spacing after a view.
This custom spacing takes precedence over any other value that might otherwise be used
for the space following the arranged subview.
Defaults to UIStackViewSpacingUseDefault (Swift: UIStackView.spacingUseDefault), where
resolved value will match the spacing property.
You may also set the custom spacing to UIStackViewSpacingUseSystem (Swift: UIStackView.spacingUseSystem),
where the resolved value will match the system-defined value for the space to the neighboring view,
independent of the spacing property.
Maintained when the arranged subview changes position in the stack view, but not after it
is removed from the arrangedSubviews list.
Ignored if arrangedSubview is not actually an arranged subview.
*/
- (void)setCustomSpacing:(CGFloat)spacing afterView:(UIView *)arrangedSubview API_AVAILABLE(ios(11.0),tvos(11.0));
- (CGFloat)customSpacingAfterView:(UIView *)arrangedSubview API_AVAILABLE(ios(11.0),tvos(11.0));
/* Baseline-to-baseline spacing in vertical stacks.
The baselineRelativeArrangement property supports specifications of vertical
space from the last baseline of one text-based view to the first baseline of a
text-based view below, or from the top (or bottom) of a container to the first
(or last) baseline of a contained text-based view.
This property is ignored in horizontal stacks. Use the alignment property
to specify baseline alignment in horizontal stacks.
Defaults to NO.
*/
@property(nonatomic,getter=isBaselineRelativeArrangement) BOOL baselineRelativeArrangement;
/* Uses margin layout attributes for edge constraints where applicable.
Defaults to NO.
*/
@property(nonatomic,getter=isLayoutMarginsRelativeArrangement) BOOL layoutMarginsRelativeArrangement;
@end
NS_ASSUME_NONNULL_END
接下来会详细的对这个API进行说明。
枚举UIStackViewDistribution
该枚举的主要的作用就是沿着堆栈轴进行布局。
/* Distribution—the layout along the stacking axis.
All UIStackViewDistribution enum values fit first and last arranged subviews tightly to the container,
and except for UIStackViewDistributionFillEqually, fit all items to intrinsicContentSize when possible.
*/
typedef NS_ENUM(NSInteger, UIStackViewDistribution) {
/* When items do not fit (overflow) or fill (underflow) the space available
adjustments occur according to compressionResistance or hugging
priorities of items, or when that is ambiguous, according to arrangement
order.
*/
UIStackViewDistributionFill = 0,
/* Items are all the same size.
When space allows, this will be the size of the item with the largest
intrinsicContentSize (along the axis of the stack).
Overflow or underflow adjustments are distributed equally among the items.
*/
UIStackViewDistributionFillEqually,
/* Overflow or underflow adjustments are distributed among the items proportional
to their intrinsicContentSizes.
*/
UIStackViewDistributionFillProportionally,
/* Additional underflow spacing is divided equally in the spaces between the items.
Overflow squeezing is controlled by compressionResistance priorities followed by
arrangement order.
*/
UIStackViewDistributionEqualSpacing,
/* Equal center-to-center spacing of the items is maintained as much
as possible while still maintaining a minimum edge-to-edge spacing within the
allowed area.
Additional underflow spacing is divided equally in the spacing. Overflow
squeezing is distributed first according to compressionResistance priorities
of items, then according to subview order while maintaining the configured
(edge-to-edge) spacing as a minimum.
*/
UIStackViewDistributionEqualCentering,
} NS_ENUM_AVAILABLE_IOS(9_0);
所有UIStackViewDistribution枚举值都适用arranged subviews中第一个和最后一个紧密排列在容器中，除了UIStackViewDistributionFillEqually外，它使所有项目都使用intrinsicContentSize。
下面我们就一起看一下这个枚举值的使用。
1. UIStackViewDistributionFill
当item不fit（overflow）或fill（underflow）时，根据item
的compressionResistance或hugging属性，或根据排列顺序的含义不明确时，可用空间调整发生。
根据stackView的大小是否固定，可以分为下面两种情况。
- stackView的大小是固定的
在xib中新放入一个stackView，如下所示
给stackView设置约束，距离边距均为20。
接着看一下布局模式，默认为Fill。
这里还要说一句，设置stackView的backgroundView的背景色是不生效的，具体原因在上面一篇已经说过了，就不多说了。
下面放入二个UIView子视图。
先放入第一个View，设置背景色是红色的。
这里可以看见，由于是Fill模式，就是我们拖动View1改变其大小的时候，松开鼠标还是会自动调整和stackView一样的大小。
这里，我们放入两个View，并放在stackView上。
我们设置蓝色View的约束
可以发现，通过调整蓝色视图的高度，红色的视图会自动调整填充stackview剩下的高度部分。
我们接着将蓝色视图的高度设置为400，看一下视图变化。
可见，这种模式的变化还是很明显的。
- stackView的大小不是固定的
设置stackview的约束，距离左上右三部分的约束，高度不做约束。
下面我们就对红蓝视图进行约束
蓝色视图约束
设置完后，可以看见，stackview自动调整自己高度为400，如下所示。
下面将红色视图的高度调整为300，看一下有什么变化。
可见，stackview可以根据他们这两个视图的变化，实现了自适应的改变。
2. UIStackViewDistributionFillEqually
items都是相同的大小。 当空间允许时，这将是具有最大intrinsicContentSize（沿着堆栈轴）的item的大小。 上溢或下溢调整在这些items之间平均分配。
- stackview高度有约束时
这个时候，会自动调整高度，使它们高度一致。
可以看见，设置高度约束后的stackview的高度为607。这个时候红蓝视图就不用进行任何约束，它们在stackview中等高。
可见，它们的高度都被设置为303.5，这个是系统自动为我们进行计算的。
- stackview不设置高度约束
我们设置好蓝色视图的约束，那么系统就会自动计算红色视图和stackview的约束。
3. UIStackViewDistributionFillProportionally
与item的intrinsicContentSizes成比例，进行上溢或下溢调整分配。
这个属性，一般是stackview的高度有约束，而2个subview的高度也有约束，注意subview的高度约束的priority要低于1000。stackview可以根据subview的约束，计算出比例，进行缩放。
4. UIStackViewDistributionEqualSpacing
应用于stackview高度确定，subview的高度也确定，想让subview比较均匀地分布在stckview中。
额外的下溢间距在items之间的空间中等分。 上溢挤压由arrangement
顺序的compressionResistance优先级进行控制。
5. UIStackViewDistributionEqualCentering
应用于stackview高度确定，subview的高度也确定，想让subview比较均匀地分布在stckview中。
item的中心到中心间距相等，尽可能保持在允许区域内的边缘到边缘的最小距离。 额外的下溢间隔在间距中相等地分开。 根据items的compressionResistance优先级分配Overflow squeezing，然后根据子视图的顺序分配Overflow squeezing，同时保持所配置的（边缘到边缘）间距最小。
后记
本篇主要介绍了布局的一个枚举，感兴趣的给个赞或者关注~~~
