Masonary三方自动布局
2020-11-04 本文已影响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
