UIStackView
的简单使用以及属性含义
StackView的强大,
例如:
1、页面有两个区域【A和B】
2、B区域永远距上(A区域)20像素
3、同时A区域支持展开和隐藏
4、每次A区域的高度修改时,同时手动去修改B区域(麻烦)
5、通过StackView可以让你不改B区域的Y坐标的情况下,实现让B区域跟着上移下移
那么StackView简直是为它量身制作的,因简书
不支持放GIF,只能贴两张图了,请看实现效果,如果这正是你所想要的,辛苦的动一下你的金手指关注点赞
一、贴图效果

二、实现代码
//
// ViewController.h
// CCUIStackView
//
// Created by Zc on 2021/5/8.
//
#import <UIKit/UIKit.h>
@interface ViewController : UIViewController
@end
//
// ViewController.m
// CCUIStackView
//
// Created by Zc on 2021/5/8.
//
#import "ViewController.h"
#import <Masonry/Masonry.h>
#define CC_View_Tag 100
//屏幕尺寸
#define kScreenHeight [UIScreen mainScreen].bounds.size.height
#define kScreenWidth [UIScreen mainScreen].bounds.size.width
@interface ViewController ()
@property (nonatomic, strong) UIButton *selectBtn;
@property (nonatomic, strong) UIStackView *stackView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
[self p_setupUI];
[self p_setupFrame];
}
- (void)p_setupUI {
[self.view addSubview:self.stackView];
[self.view addSubview:self.selectBtn];
}
- (void)p_setupFrame {
[self.stackView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.equalTo(self.view).offset(0);
make.top.equalTo(self.view).offset(64);
// make.height.mas_equalTo(([UIScreen mainScreen].bounds.size.width - 60) / 5);
}];
[self.selectBtn mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.stackView.mas_bottom).with.offset(15);
make.centerX.equalTo(self.view).with.offset(0);
// make.centerY.equalTo(self.view).with.offset(0);
make.size.mas_equalTo(CGSizeMake(200, 50));
}];
}
- (UIStackView *)stackView {
if (!_stackView) {
// 初始化
//label数量
CGFloat count = 3;
_stackView = [[UIStackView alloc]init];
//属性
// 子视图间隔
_stackView.spacing = 10;
// 布局方向 (默认竖向向布局)
_stackView.axis = UILayoutConstraintAxisVertical;
// 子视图对齐方式 (枚举值
_stackView.alignment = UIStackViewAlignmentFill;
// // 子视图分部方式 (枚举值)
_stackView.distribution = UIStackViewDistributionFillEqually;
//方法
// 将子视图,添加到 stackView 的 arrangedSubviews列表中
// [_stackView addArrangedSubview:label];
// // 删除 stackView的 arrangedSubviews列表中的 view
// [_stackView removeArrangedSubview:lastLabel];
// //插入一个视图到 stackView的 arrangedSubviews列表中
// [_stackView insertArrangedSubview:labelatIndex:2];
CGFloat left = 12;
CGFloat right = 12;
CGFloat itemSpace = 8;
CGFloat width = (kScreenWidth - left - right - itemSpace * 2) / 3;
CGFloat height = 140;
for (int i = 0; i < count; i ++) {
UIView *view = [[UIView alloc]init];
view.tag = CC_View_Tag + i;
[_stackView addArrangedSubview:view];
for (int j = 0; j < 3; j ++) {
UILabel *label = [[UILabel alloc]init];
label.text = [NSString stringWithFormat:@"%d,%d",i,j];
label.backgroundColor = [UIColor orangeColor];
label.textAlignment = NSTextAlignmentCenter;
label.font = [UIFont systemFontOfSize:12.0];
[view addSubview:label];
[label mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.bottom.offset(0);
make.left.equalTo(view).with.offset(j == 0 ? left : j == 1? left + width + itemSpace:left+width*2 + itemSpace*2);
make.size.mas_equalTo(CGSizeMake(width, height));
}];
}
}
}
return _stackView;
}
- (void)p_selectBtnClick:(UIButton *)sender {
sender.selected = !sender.selected;
for (UIView *l in self.stackView.arrangedSubviews) {
if (l.tag > CC_View_Tag) {
l.hidden = sender.selected;
}
}
}
- (UIButton *)selectBtn {
if (!_selectBtn) {
_selectBtn = [UIButton buttonWithType:UIButtonTypeSystem];
[_selectBtn setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
[_selectBtn setTitle:@"点我修改布局" forState:UIControlStateNormal];
[_selectBtn addTarget:self action:@selector(p_selectBtnClick:) forControlEvents:UIControlEventTouchUpInside];
}
return _selectBtn;
}
@end
复杂使用方式自由想象,尽情的去开发自己的想象力吧~~
网友评论