美文网首页
Masonary三方自动布局

Masonary三方自动布局

作者: 我不白先生 | 来源:发表于2020-11-04 18:17 被阅读0次

可以引入第三方的库来实现添加约束,Masonry是一套非常优秀的第三方框架,使用方便的语法,只管的语义实现对约束的管理。
步骤一:添加第三方库

第三方库的文件可以从Github上下载,直接拖拽到工程中即可。效果如图-1所示:

image image.png image.png image.png image.png image.png

yellowView此处可以简化
第一变


image.png

第二变


image.png
第三变
image.png
接着blueView代码
image.png

此处可简化


image.png
屏幕效果
image.png
需求
image.png
image.png
image.png
简化

grayView(1)


image.png

grayView(2)


image.png

orangeView(1)背景色改成orangeColor


image.png

orangeView(2)需求修改�


image.png
image.png

brownView


image.png

练习
屏幕效果


image.png

ViewController.m

#import "ViewController.h"
#define MAS_SHORTHAND_GLOBALS
#import "Masonry.h"
@interface ViewController ()
@property(nonatomic,strong)UIButton *closeButton;
@property(nonatomic,strong)UIImageView *logoImageView;
@property(nonatomic,strong)UITextField *phoneTextField;
@property(nonatomic,strong)UIButton *codeButton;
@property(nonatomic,strong)UITextField *codeTextField;
@property(nonatomic,strong)UIButton *passwordButton;
@property(nonatomic,strong)UIButton *protocolButton;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [self closeButton];
    [self logoImageView];
    [self phoneTextField];
    [self codeButton];
    [self codeTextField];
    [self passwordButton];
    [self protocolButton];
}
-(UIButton *)protocolButton{
    if(!_protocolButton){
        _protocolButton= [UIButton buttonWithType:UIButtonTypeSystem];
        NSDictionary *dic = @{
                              NSFontAttributeName:[UIFont systemFontOfSize:12],
                              NSForegroundColorAttributeName:[UIColor orangeColor],
                              //设置下划线可见
                              NSUnderlineStyleAttributeName:@YES,
                              //设置下划线颜色
                              NSUnderlineColorAttributeName:[UIColor orangeColor]
                              };
        _protocolButton = [UIButton buttonWithType:UIButtonTypeSystem];
        NSAttributedString *title = [[NSAttributedString alloc]initWithString:@"用户协议" attributes:dic];
        [_protocolButton setAttributedTitle:title forState:UIControlStateNormal];
       
        
        UILabel *label = [[UILabel alloc]init];
        label.font = [UIFont systemFontOfSize:12];
        label.text = @"点击登陆,即表示您同意";
        UIStackView *sv = [[UIStackView alloc]init];
        [sv addArrangedSubview:label];
        [sv addArrangedSubview:_protocolButton];
        //设置子视图的排布方式
        sv.axis = UILayoutConstraintAxisHorizontal;
        [self.view addSubview:sv];
        [sv mas_makeConstraints:^(MASConstraintMaker *make) {
            make.centerX.equalTo(0);
            make.bottom.equalTo(-20);
        }];
    }
    return _protocolButton;
}
-(UIButton *)passwordButton{
    if(!_passwordButton){
        _passwordButton = [UIButton buttonWithType:UIButtonTypeSystem];
        NSDictionary *dic = @{
                              NSFontAttributeName:[UIFont systemFontOfSize:12],
                              NSForegroundColorAttributeName:[UIColor orangeColor],
                              //设置下划线可见
                              NSUnderlineStyleAttributeName:@YES,
                              //设置下划线颜色
                               NSUnderlineColorAttributeName:[UIColor orangeColor]
                              };
        _passwordButton = [UIButton buttonWithType:UIButtonTypeSystem];
        NSAttributedString *title = [[NSAttributedString alloc]initWithString:@"密码登陆" attributes:dic];
        [_passwordButton setAttributedTitle:title forState:UIControlStateNormal];
        [self.view addSubview:_passwordButton];
        [_passwordButton mas_makeConstraints:^(MASConstraintMaker *make) {
            make.right.equalTo(-25);
            make.top.equalTo(self.codeButton.mas_bottom).equalTo(30);
        }];
    }
    return _passwordButton;
}
-(UITextField *)codeTextField{
    if(!_codeTextField){
        _codeTextField = [[UITextField alloc]init];
        _codeTextField.placeholder = @"输入验证码";
        _codeTextField.keyboardType = UIKeyboardTypePhonePad;
        [self.view addSubview:_codeTextField];
        [_codeTextField mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(self.phoneTextField);
            make.top.equalTo(self.phoneTextField.mas_bottom).offset(24);
            make.right.equalTo(self.codeButton.mas_left).offset(-10);
        }];
        UIView *lineview  = [[UIView alloc]init];
        [self.view addSubview:lineview];
        lineview.backgroundColor = [UIColor grayColor];
        [lineview mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(10);
            make.right.equalTo(-10);
            make.top.equalTo(self.codeTextField.mas_bottom).offset(12);
            make.height.equalTo(1);
        }];
    }
    return _codeTextField;
}
-(UIButton *)codeButton{
    if (!_codeButton) {
        _codeButton = [UIButton buttonWithType:UIButtonTypeSystem];
        [_codeButton setBackgroundImage:[UIImage imageNamed:@"验证码框"] forState:UIControlStateNormal];
        [_codeButton setTitle:@"获取验证码" forState:UIControlStateNormal];
        [_codeButton setTitleColor:[UIColor orangeColor] forState:UIControlStateNormal];
        _codeButton.titleLabel.font = [UIFont systemFontOfSize:11];
        [self.view addSubview:_codeButton];
        [_codeButton mas_makeConstraints:^(MASConstraintMaker *make) {
            make.centerY.equalTo(self.codeTextField);
            make.right.equalTo(-25);
            make.height.equalTo(28);
            make.width.equalTo(90);
        }];
    }
    return _codeButton;
}
-(UIButton*)closeButton{
    if(!_closeButton){
       _closeButton = [UIButton buttonWithType:UIButtonTypeCustom];
        [_closeButton setBackgroundImage:[UIImage imageNamed:@"ahj"] forState:UIControlStateNormal];
        [_closeButton setBackgroundImage:[UIImage imageNamed:@"ahi"] forState:UIControlStateHighlighted];
        [self.view addSubview:_closeButton];
        [_closeButton mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(24);
            make.right.equalTo(-17);
        }];
    }
    return _closeButton;
}
-(UIImageView *)logoImageView{
    if(!_logoImageView){
        _logoImageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"logo"]];
        [self.view addSubview:_logoImageView];
        [_logoImageView mas_makeConstraints:^(MASConstraintMaker *make) {
       
            make.top.equalTo(80);
           make.centerX.equalTo(0);
        }];
    }
    return _logoImageView;
}
-(UITextField *)phoneTextField{
    if(!_phoneTextField){
        _phoneTextField = [[UITextField alloc]init];
        _phoneTextField.placeholder = @"输入手机号";
        _phoneTextField.keyboardType = UIKeyboardTypePhonePad;
        [self.view addSubview:_phoneTextField];
        [_phoneTextField mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(25);
            make.right.equalTo(-25);
            make.top.equalTo(self.logoImageView.mas_bottom).offset(30);
        }];
        //第一种给textfeild加下划线
//        UIImageView *imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"Line"]];
//        [self.view addSubview:imageView];
//        [imageView mas_makeConstraints:^(MASConstraintMaker *make) {
//            make.left.equalTo(10);
//            make.right.equalTo(-10);
//            make.top.equalTo(self.phoneTextField.mas_bottom).equalTo(12);
//        }];
        //第二种创建view制出下划线的视觉效果
        UIView *myview  = [[UIView alloc]init];
        [self.view addSubview:myview];
        myview.backgroundColor = [UIColor grayColor];
        [myview mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(10);
            make.right.equalTo(-10);
            make.top.equalTo(self.phoneTextField.mas_bottom).offset(12);
            make.height.equalTo(1);
        }];

    }
  return _phoneTextField;
}
@end

相关文章

  • Masonary三方自动布局

    可以引入第三方的库来实现添加约束,Masonry是一套非常优秀的第三方框架,使用方便的语法,只管的语义实现对约束的...

  • Masonary三方布局音乐列表练习

    AppDelegate.m Music.h Music.m MusicTableViewController.m ...

  • NSLayoutAnchor与Snapkit简易布局动画对比(s

    ios自带自动布局太过繁琐,所以一直采用第三方框架Snapkit的自动布局。NSLayoutAnchor(ios9...

  • SnapKit浅析,原理

    SnapKit的原理是啥,或者说是怎么实现自动布局的? SnapKit是Swift开发中常用的自动布局的三方库,虽...

  • Masonary循环自动添加

    ViewController.m 练习屏幕效果image.png ViewController.m 滚动视图加约束...

  • AutoLayout之Masonry

    什么是Masonry Masonry是一个对原生NSLayoutConstraint布局进行封装的第三方自动布局框...

  • 关于Masonary布局与NSAutoresizingMaskL

    在项目中出现下面的警告,虽然界面上没出现错误,但是对于有强迫症的程序员来说是难以忍受的。百度后发现一句代码就解决问...

  • Masonry源码解析

    Masonry简介 Masonry是用于自动布局的第三方框架,对苹果的自动布局框架进行了一层封装,其接口比起官方的...

  • iOS-masonry 使用

    需要记录的一点: 1.简介 基于NSLayoutConstraint封装的第三方布局框架,实现自动布局,采用链式编...

  • iOS常用第三方框架

    iOS常用第三方框架 自动布局框架Masonry // Objective-C https://github....

网友评论

      本文标题:Masonary三方自动布局

      本文链接:https://www.haomeiwen.com/subject/tzabvktx.html