Masonry 是强大AutoLayout框架。
masonry预备篇
知识点(1)AutoLayout关于更新的几个方法的区别
setNeedsLayout
:告知页面需要更新,但是不会立刻进行更新。执行后会立刻调用layoutSubViews
方法。
layoutIfNeeded
:告知页面布局立刻更新。所以一般会和setNeedsLayout
一起使用。如果要立刻生成新的frame需要调用此方法,利用这点一般布局动画可以在更新布局后直接使用这个方法让动画生效。
layoutSubViews
:系统重写布局
setNeedsUpdateConstraints
:告知需要更新约束,但是不会立刻开始
updateConstrainsIfNeeded
:告知立刻更新约束
updateConstraints
:系统更新约束
知识点(2)基本使用
** mas_makeConstrins
**:添加约束
mas_updateContraints
:更新约束、亦可增加新的约束
mas_remakeConstraints
:重置之前的约束
multipler
属性表示约束值为约束对象的乘因数,dividedBy
属性表示约束值为约束对象的除因数,可用于设置view
的宽高比。
masonry详解篇
1.mas_makeContstraints 只负责新增约束
新增一个约束使得self.tableView的边缘等于self.view。
[self.tableView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.mas_equalTo(self.view);
}];
两个或两个以上的控件等间隔排序(第一种)。
/**
* 多个控件固定间隔的等间隔排列,变化的是控件的长度或者宽度值
*
* @param axisType 轴线方向(Horizontal,Vertical)
* @param fixedSpacing 间隔大小
* @param leadSpacing 头部间隔
* @param tailSpacing 尾部间隔
*/
- (void)mas_distributeViewsAlongAxis:(MASAxisType)axisType
withFixedSpacing:(CGFloat)fixedSpacing
leadSpacing:(CGFloat)leadSpacing
tailSpacing:(CGFloat)tailSpacing;
🌰
[@[btn1, btn2, btn3] mas_distributeViewsAlongAxis:MASAxisTypeHorizontal
withFixedSpacing:40
leadSpacing:15
tailSpacing:15];
两个或两个以上的控件等间隔排序(第二种)。
/**
* 多个固定大小的控件的等间隔排列,变化的是间隔的空隙
*
* @param axisType 轴线方向
* @param fixedItemLength 每个控件的固定长度或者宽度值
* @param leadSpacing 头部间隔
* @param tailSpacing 尾部间隔
*
/- (void)mas_distributeViewsAlongAxis:(MASAxisType)axisType
withFixedItemLength:(CGFloat)fixedItemLength
leadSpacing:(CGFloat)leadSpacing
tailSpacing:(CGFloat)tailSpacing;
🌰🌰
[@[btn1, btn2, btn3] mas_distributeViewsAlongAxis:MASAxisTypeHorizontal
//btn1,btn2,btn3三个btn的宽为80 距离左边15 距离右边15
withFixedItemLength:80
leadSpacing:15
tailSpacing:15];
[@[btn1, btn2, btn3] mas_makeConstraints:^(MASConstraintMaker *make) {
//距离顶部的距离
make.top.mas_equalTo(0);
}];
效果图🏃:
2.mas_updateConstraints更新约束
创建self.growingButton点击会放大
[self.growingButton addTarget:self action:@selector(onGrowButtonTaped:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:self.growingButton];
self.scacle = 1.0;
[self.growingButton mas_updateConstraints:^(MASConstraintMaker *make) {
make.center.mas_equalTo(self.view);
// 初始宽、高为100,优先级最低
make.width.height.mas_equalTo(100 * self.scacle).priorityLow();
// 最大放大到整个view
make.width.height.lessThanOrEqualTo(self.view);
}];
响应事件
- (void)onGrowButtonTaped:(UIButton *)sender {
self.scacle += 0.2;
// 告诉self.view约束需要更新
[self.view setNeedsUpdateConstraints];
// 调用此方法告诉self.view检测是否需要更新约束,若需要则更新,下面添加动画效果才起作用
[self.view updateConstraintsIfNeeded];
[UIView animateWithDuration:0.3 animations:^{
[self.view layoutIfNeeded];
}];
}
重写方法
- (void)updateViewConstraints {
[self.growingButton mas_updateConstraints:^(MASConstraintMaker *make) {
make.center.mas_equalTo(self.view);
// 初始宽、高为100,优先级最低
make.width.height.mas_equalTo(100 * self.scacle).priorityLow();
// 最大放大到整个view
make.width.height.lessThanOrEqualTo(self.view);
}];
[super updateViewConstraints];
}
持续更新中....