Masonry的自我理解

做开发的总会遇到代码的自动布局.

masonry 是我一个轻量级布局框架

Masonry 源码：https://github.com/Masonry/Masonry

使用

masonry 的语法:

[view1 mas_makeConstraints:^(MASConstraintMaker *make) {

make.edges.equalTo(superview).with.insets(padding);//设置四周以父视图为标准嵌入 padding 的像素

}];

属性:

@property (nonatomic, strong, readonly) MASConstraint *left;//左边

@property (nonatomic, strong, readonly) MASConstraint *top;//顶部

@property (nonatomic, strong, readonly) MASConstraint *right;//右边

@property (nonatomic, strong, readonly) MASConstraint *bottom;//底部

@property (nonatomic, strong, readonly) MASConstraint *leading;//首部等价于 left

@property (nonatomic, strong, readonly) MASConstraint *trailing;//尾部 等价于 right

@property (nonatomic, strong, readonly) MASConstraint *width;//宽

@property (nonatomic, strong, readonly) MASConstraint *height;//高

@property (nonatomic, strong, readonly) MASConstraint *centerX;//X 轴中心

@property (nonatomic, strong, readonly) MASConstraint *centerY;//Y 轴中心

@property (nonatomic, strong, readonly) MASConstraint *baseline;//文本基线

加入以下声明可不用写 mas_ 等前缀

//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

其中leading与left,trailing与right 在正常情况下是等价的 但是当一些布局是从右至左时(比如阿拉伯文?没有类似的经验) 则会对调 换句话说就是基本可以不理不用 用left和right就好了.

demo:

UIView * sv = [UIView new];

sv.backgroundColor= [UIColor redColor];

[self.viewaddSubview:sv];

[sv makeConstraints:^(MASConstraintMaker*make) {

make.center.equalTo(self.view).with.offset(@-10);//父视图中心向左偏移10个像素

make.size.equalTo(CGSizeMake(300,300));//300*300的矩形

}];

UIScrollView* scrollview = [UIScrollView new];

scrollview.backgroundColor= [UIColor whitColor];

[sv addSubview:scrollview];

[scrollview makeConstraints:^(MASConstraintMaker*make) {

make.edges.equalTo(sv).with.insets(UIEdgeInsetsMake(5,5,5,5));//上下左右间隔为5像素

}];

UIView* container = [UIView new];

[scrollview addSubview:container];//scrollView里面加了一个视图

[container makeConstraints:^(MASConstraintMaker*make) {

make.edges.equalTo(scrollview);//四周相同

make.width.equalTo(scrollview);//并且同宽

}];

int count =10;

UIView* lastView =nil;

for(int i =1; i<=count; i++) {

UIView* subv = [UIView new];

[container addSubview:subv];

subv.backgroundColor= [UIColor colorWithHue:(arc4random()%256/256.0)saturation:(arc4random() %128/256.0)brightness:(arc4random() %128/256.0)alpha:1];

[subv makeConstraints:^(MASConstraintMaker*make) {

make.left.and.right.equalTo(container);//左右和父视图一样

make.height.equalTo(@(20*i));//高不一样.

if(lastView) {

make.top.equalTo(lastView.bottom);

}else

{

make.top.equalTo(container.top);

}

}];

lastView = subv;

}

[container makeConstraints:^(MASConstraintMaker*make) {

make.bottom.equalTo(lastView.bottom);//父视图最下部和最后一个视图底部一样大小

}];

-------------------------------------------------------------------

基本用法就是这些  上面demo 将会出现一个滑动视图.基础就那么多吧.实际写了再发一篇