iOS-UIStackView实际用途

huicongfu
148 阅读3分钟

由于目前我这边是用Masonry的方式开发，所以没有怎么留意Storyboard的新技术，最近朋友一直在说 UIStackView 用得非常爽，经常安利我，然后就忍不住去看了看资料，发现入门还是挺容易的，但这个技术门槛比较高：iOS9以上可用，目前国内的App基本都要兼容iOS8，而其真正的威力是使用Storyboard开发。所以一直在想它有什么实际用途，先看看其简介和属性。

####简介 UIStackView简化了使用代码或者拖拽来处理行或者列的视图集合，它可以根据你设置的属性自动处理排列变化。 UIStackView 和传统容器类另一个区别是它自己虽然继承自 UIView，但它本身不能自我渲染，比如它的 backgroundColor 是无效的，所以它注定要和 UIView 相辅相成的进行工作。它能够帮助 UIView 来处理 子View 的位置和大小等布局问题。 层级关系

####属性 ######下图是它的三个主要属性： 三个主要的属性

#####一.axis(轴向) 属性 设置布局的方向，有水平和垂直两种方式，一个StackView只能选择其中一种布局模式。

typedef NS_ENUM(NSInteger, UILayoutConstraintAxis) {
    UILayoutConstraintAxisHorizontal = 0, //水平布局方向
    UILayoutConstraintAxisVertical = 1 //垂直布局方向
};

#####二.distribution(分布) 属性 告诉系统布局管理的子视图在沿着其轴向（axis）上的布局关系

typedef NS_ENUM(NSInteger, UIStackViewDistribution) {
    UIStackViewDistributionFill = 0, //充满
    UIStackViewDistributionFillEqually, //平分充满
    UIStackViewDistributionFillProportionally, //根据约束的尺寸分配
    UIStackViewDistributionEqualSpacing, //等间距分配
    UIStackViewDistributionEqualCentering, //中心距离相等
} NS_ENUM_AVAILABLE_IOS(9_0);

#####三.alignment(对齐) 属性 告诉系统它管理的视图在垂直于其轴向上的布局

typedef NS_ENUM(NSInteger, UIStackViewAlignment) {
    UIStackViewAlignmentFill, // 子视图填充StackView
    UIStackViewAlignmentLeading, // 子视图左对齐（axis为垂直方向而言）
    UIStackViewAlignmentTop = UIStackViewAlignmentLeading, // 子视图顶部对齐（axis为水平方向而言）
    UIStackViewAlignmentFirstBaseline, // 按照第一个子视图的文字的第一行对齐，同时保证高度最大的子视图底部对齐（只在axis为水平方向有效）
    UIStackViewAlignmentCenter, // 子视图居中对齐
    UIStackViewAlignmentTrailing, // 子视图右对齐(axis为垂直方向而言）
    UIStackViewAlignmentBottom = UIStackViewAlignmentTrailing, //子视图底部对齐（axis为水平方向而言）
    UIStackViewAlignmentLastBaseline, // 按照最后一个子视图的文字的最后一行对齐，同时保证高度最大的子视图顶部对齐（只在axis为水平方向有效）
} NS_ENUM_AVAILABLE_IOS(9_0);

#####四.spacing(空隙) 属性 设置子视图之间的间距，是子视图之间的最小间距

内容变多优先级：content hugging priorities，默认给的值是UILayoutPriorityDefaultLow = 250 父视图变大，哪个标签变宽？ 内容变多优先级高的视图不会拉伸

内容变少优先级：content compression resistance priorities，默认给的值是UILayoutPriorityDefaultHigh = 750 父视图变小，标签该怎么压缩呢？ 内容变少优先级高的视图更能抵抗压缩，也就是不省略文字

#黄色View只会发生一次变化，就多设一个优先级较低的约束就好
[self.yellowView mas_makeConstraints:^(MASConstraintMaker *make) { make.width.height.mas_equalTo(100); make.left.equalTo(weakSelf.orangeView.mas_right).offset(20); make.top.offset(50); #当橙色View消失后,黄色View缺少左边约束，所以给其加一个优先级更低的左边约束。当第一个左边约束失效后，这个约束就起作用了 make.left.equalTo(weakSelf.view.mas_left).offset(20).priority(300);

}];

如果我们想让subView的宽度是 父视图的宽度的30% + 10个单位长度，这时候我们该怎么设置呢？ [subView mas_makeConstraints:^(MASConstraintMaker *make) { make.width.equalTo(self).offset(10).multipliedBy(0.3);}]multipliedBy 和 dividedBy这两个方法，一个是乘法，一个是除法 [subView mas_makeConstraints:^(MASConstraintMaker *make) { make.width.equalTo(self).multipliedBy(0.5);}]

[self.gasTitleLabel mas_makeConstraints:^(MASConstraintMaker *make) { make.left.equalTo(weakSelf.gasIconImageView.mas_right).offset(margin); make.top.mas_equalTo(22); make.height.mas_equalTo(16); }];

[self.gasStatusLabel mas_makeConstraints:^(MASConstraintMaker *make) {
    make.left.equalTo(weakSelf.gasTitleLabel.mas_right).offset(4);
    make.height.mas_equalTo(18);
    make.width.mas_equalTo(42);
    make.right.mas_lessThanOrEqualTo(-16);
    make.centerY.equalTo(weakSelf.gasTitleLabel);
}];

参考： 浅谈UIStackView UIStackView 入坑指南 iOS9之UIStackView体验,无需任何约束，这才是真正的自动布局，快到不能呼吸 iOS AutoLayout阅读笔记1----->Hugging Priority & Compression Resistance Priority 官方文档

avatar
文章
阅读
粉丝