开篇牢骚
今天抽空简单介绍一下masonry的基本使用。网上好多的教程都写得很简单。虽然我不保证我写的很高深，但敢保证绝对原创。
顺便介绍以下**如何通过Xcode在真机上截屏保存到Mac上**，起初这个简单事情自己还废了七八分钟来找，网上搜了一下都是告诉你**模拟器**如何截屏的。
- 1.在真机上运行你的项目
- 2.在xcode的菜单选项中找到Debug选项，选择View Debugging。如下图
View Debugging.png
- 3.选择Take Screenshot of
Take Screenshot of.png
-
4.点击这个选项之后再Mac的桌面机会出现你在真机上截取的图片了
图片命名是通过时间关联的。
真机截屏图片.png
进入主题
基本使用
我们在为每个使用Masonry布局的view进行布局之前，必须把view加入到一个视图之上，也就是这个view必须具有父视图。如果不这样，则会出现
'NSInternalInconsistencyException', reason: 'couldn't find a common superview for这样的错误信息。切记，一定要先有父视图才能使用
再来看看最为基本的用法：
[greenView makeConstraints:^(MASConstraintMaker *make) {
make.top.greaterThanOrEqualTo(superview.top).offset(padding);
make.left.equalTo(superview.left).offset(padding);
make.bottom.equalTo(blueView.top).offset(-padding);
make.right.equalTo(redView.left).offset(-padding);
make.width.equalTo(redView.width);
make.height.equalTo(redView.height);
make.height.equalTo(blueView.height);
}];
其实这里的equalTo是一个宏定义而已，不信，我把它原型找出来（还有它的兄弟）
equalTo本质.png
非常清除看到我们平时用的equalTo本质是什么。
如果需要直接使用Masonry中的equalTo这些宏定义，需要再预编译文件中加入如下几句：
//define this constant if you want to use Masonry without the 'mas_' prefix
#define MAS_SHORTHAND
//define this constant if you want to enable auto-boxing for default syntax
#define MAS_SHORTHAND_GLOBALS
如果你项目里面已经存在了view的一个分类（UIview + Positoning）快速获取视图的frame的各个属性。如下：
UIView+Positoning.png
那就不要用缩写了
写成
make.right.mas_equalTo(superview.mas_left).offset(@12);
三个常用的添加约束的方法
关于常见的三个添加约束的方法，这里不去讲了。因为这些都可以自己找到的。直接通过xcode就能找到。如下图：
Paste_Image.png
所以这些网上说的，其实大部分自己都可以找到。
UIScroll使用Masonry
这里有必要说说ScrollView使用约束怎么实现。之前在网上找到如果ScrollView需要使用约束，需要添加一个辅助视图。经过自己测试，如果直接将view记到scrollview上是不能滑动的。具体原因我猜测可能是直接添加到scrollView上，位置就定死了。contentSize就居然为width = 0, height = 0。
添加到辅助视图就是正常的了
width = 320, height = 1375。相关代码如下：
// 辅助视图
UIView* contentView = UIView.new;
[self.scrollView addSubview:contentView];
[contentView makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.scrollView);
make.width.equalTo(self.scrollView);
}];
UIView *lastView;
CGFloat height = 25;
for (int i = 0; i < 10; i++) {
UIView *view = UIView.new;
view.backgroundColor = [self randomColor];
// 添加到辅助视图上
[contentView addSubview:view];
[view mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(lastView ? lastView.bottom : @0);
make.left.equalTo(@0);
make.width.equalTo(contentView.width);
make.height.equalTo(@(height));
}];
height += 25;
lastView = view;
}
[contentView makeConstraints:^(MASConstraintMaker *make) {
make.bottom.equalTo(lastView.bottom);
}];
说说动画
约束实现动画比用frame要麻烦一点。先来看看几个基本的东东
- 1.updateConstraints
- 2.setNeedsUpdateConstraints
- 3.updateConstraintsIfNeeded
对应的解释xcode都能看到。我这里其实和frame布局中用到的对比一下就知道什么了 - 1.layoutSubviews 系统自己调用
- 2.setNeedsLayout 手动调用，会在系统下个重绘自动调用layoutSubview
- 3.layoutIfNeeded 手动调用，立即调用layoutSubview
这样一看是不是清晰多了
最后给出一般约束做动画需要怎么写
- (void)updateConstraints {
[self.growingButton updateConstraints:^(MASConstraintMaker *make) {
make.center.equalTo(self);
make.width.equalTo(@(self.buttonSize.width)).priorityLow();
make.height.equalTo(@(self.buttonSize.height)).priorityLow();
make.width.lessThanOrEqualTo(self);
make.height.lessThanOrEqualTo(self);
}];
//according to apple super should be called at end of method
[super updateConstraints];
}
- (void)didTapGrowButton:(UIButton *)button {
self.buttonSize = CGSizeMake(self.buttonSize.width * 1.3, self.buttonSize.height * 1.3);
// tell constraints they need updating
[self setNeedsUpdateConstraints];
// update constraints now so we can animate the change
[self updateConstraintsIfNeeded];
[UIView animateWithDuration:0.4 animations:^{
[self layoutIfNeeded];
}];
}
总结
其实讲的这些都很基础，但是有的时候基础都不知道很难有所提升。**下个周给出一篇有深度的文章**