用Masonry升级Autolayout

之前写Autolayout都是用xib或者非常非常诡异的纯代码,就算用了VFL也只是增加了可读性,代码并没有减少,现在发现了一个第三方框架Masonry觉得有必要学习一下,这里记录下学习笔记,还有一些之前用Autolayout忽略的知识

简单说一下Masonry的使用,可以使用三个方法

语法基于block,可以单独设置间距,或者一次性设置所有间距,或者链式间距

下面是让一个视图放入父视图里的代码

下面是两个视图关系的代码

    [greenView makeConstraints:^(MASConstraintMaker *make) {

        make.top.equalTo(superview.top).offset(padding);

        make.left.equalTo(superview.left).offset(padding);

        make.right.equalTo(redView.left).offset(-padding);

        make.width.equalTo(redView.width);

        make.bottom.equalTo(superview.bottom).offset(-padding);

    }];

    [redView mas_makeConstraints:^(MASConstraintMaker *make) {

        make.top.equalTo(superview.top).with.offset(padding); //with with

        make.left.equalTo(greenView.right).offset(padding); //without with

        make.right.equalTo(superview.right).offset(-padding);

        make.width.equalTo(greenView.width);

        make.bottom.equalTo(superview.bottom).offset(-padding);

    }];

IMG_8341

写Scroll的例子

IMG_8342

高宽比ratio的例子

下面列举了两种写法

一种是ratio宽高定比以后,设定一个宽度,其他自己算

另一种是ratio宽高比以后,设定宽高都小于一个范围,其他自己算,第二种不太容易理解,暂时使用第一种

IMG_8396

简单动画

下面实现一个简单的button,点击以后会放大,关键的是下面两个方法,对于一个自定义的View来说,updateConstrains要重写,调用动画的时候会调用这个方法。进行动画也要有固定的模式,如下面代码

AutoLayout几个更新方法的区别

  • setNeedsLayout:告知页面需要更新,但是不会立刻开始更新。执行后会立刻调用layoutSubviews。
  • layoutIfNeeded:告知页面布局立刻更新。所以一般都会和setNeedsLayout一起使用。如果希望立刻生成新的frame需要调用此方法,利用这点一般布局动画可以在更新布局后直接使用这个方法让动画生效。
  • layoutSubviews:系统重写布局
  • setNeedsUpdateConstraints:告知需要更新约束,但是不会立刻开始
  • updateConstraintsIfNeeded:告知立刻更新约束
  • updateConstraints:系统更新约束

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

发表评论

电子邮件地址不会被公开。 必填项已用*标注