发布于 2016-01-04 22:14:25 | 182 次阅读 | 评论: 0 | 来源: PHPERZ

这里有新鲜出炉的精品教程,程序狗速度看过来!

Masonry jQuery布局插件

Masonry是一 个用来布局的jQuery插件


Masonry是用代码实现自动布局的第三方框架。

使用之前首先要导入框架,以下是具体的代码实现。

1.中心点与父视图相同

#import "ViewController.h"
#import "Masonry.h"
@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

//    [self setView1];


 

//    [self setView2];


 

    //[self setView3];


   [self setView4];

}
/**
 *  中心点与父视图相同
 */
-(void)setView1{
    UIView *mainView = [[UIView alloc] init];
    mainView.backgroundColor = [UIColor redColor];
    [self.view addSubview:mainView];
    [mainView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.center.equalTo(self.view);
        make.size.mas_equalTo(CGSizeMake(200, 200));
    }];
}

2.距离上下左右边距

/**
 *  距离上下左右边距
 */
-(void)setView2{
    UIView *mainView = [[UIView alloc] init];
    mainView.backgroundColor = [UIColor redColor];
    [self.view addSubview:mainView];
    [mainView mas_makeConstraints:^(MASConstraintMaker *make) {
        //make.edges.equalTo(self.view).with.insets(UIEdgeInsetsMake(100, 80, 50, 10));
        make.left.equalTo(self.view).with.offset(10);
        make.right.equalTo(self.view).with.offset(-20);
        make.top.equalTo(self.view).with.offset(30);
        make.bottom.equalTo(self.view).with.offset(-40);
    }];

 3.两个视图左右排开间距是10

-(void)setView3{
    //左边视图
    UIView *rightView = [[UIView alloc] init];
    rightView.backgroundColor = [UIColor redColor];
    [self.view addSubview:rightView];
    //右边视图
    UIView *leftView1 = [[UIView alloc] init];
    leftView1.backgroundColor = [UIColor greenColor];
    [self.view addSubview:leftView1];
    
 [rightView mas_makeConstraints:^(MASConstraintMaker *make) {
     make.centerY.mas_equalTo(self.view.mas_centerY);
     make.height.mas_equalTo(150);
     make.width.mas_equalTo(leftView1.mas_width);
     make.left.mas_equalTo(self.view.mas_left).with.offset(10);
     make.right.mas_equalTo(leftView1.mas_left).with.offset(-10);
 }];
 [leftView1 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.centerY.mas_equalTo(self.view.mas_centerY);
        make.height.mas_equalTo(150);
        make.width.mas_equalTo(rightView.mas_width);
        make.left.mas_equalTo(rightView.mas_right).with.offset(10);
        make.right.mas_equalTo(self.view.mas_right).with.offset(-10);
    }];
}

4.登录界面

-(void)setView4{
    UITextField *accountTextField = [[UITextField alloc] init];
    accountTextField.backgroundColor = [UIColor redColor];
    accountTextField.placeholder = @"账号";
    [self.view addSubview:accountTextField];
    
    UITextField *secretTextField = [[UITextField alloc] init];
    secretTextField.backgroundColor = [UIColor greenColor];
    secretTextField.placeholder = @"密码";
    [self.view addSubview:secretTextField];
    UIButton *loginButton = [[UIButton alloc] init];
    loginButton.backgroundColor = [UIColor blueColor];
    [loginButton setTitle:@"登录" forState:UIControlStateNormal];
    [self.view addSubview:loginButton];
    [accountTextField mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(self.view.mas_left).offset(50);
        make.right.equalTo(self.view.mas_right).offset(-50);
        make.top.equalTo(self.view.mas_top).offset(100);
        make.height.mas_equalTo(50);
    }];
    [secretTextField mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(self.view.mas_left).offset(50);
        make.right.equalTo(self.view.mas_right).offset(-50);
        make.top.equalTo(accountTextField.mas_bottom).offset(40);
        make.height.mas_equalTo(50);
    }];
    [loginButton mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(self.view.mas_left).offset(100);
        make.right.equalTo(self.view.mas_right).offset(-100);
        make.top.equalTo(secretTextField.mas_bottom).offset(40);
        make.height.mas_equalTo(50);
    }];
    
}

以下为源码连接地址:http://pan.baidu.com/s/1eRnfs8i



最新网友评论  共有(0)条评论 发布评论 返回顶部

Copyright © 2007-2017 PHPERZ.COM All Rights Reserved   冀ICP备14009818号  版权声明  广告服务