iOS中Constraint的屏幕适配方案

2020-01-19  本文已影响0人  数字d

常规操作不赘述

这里放几个不常见但是实用的

1.Content Hugging Priority:直译成中文就是“内容拥抱优先级”,从字面意思上来看就是两个视图,谁的“内容拥抱优先级”高,谁就抱的更紧一些,抗拉伸能力强。

2.Content Compression Resistance Priority:该优先级直译成中文就是“内容压缩阻力优先级”。也就是视图的“内容压缩阻力优先级”越大,那么该视图中的内容越难被压缩。而该优先级小的视图,则内容优先被压缩。抗压缩能力。

1

3.在有时候设置控件和父视图的边界时候,设置为0,但是刷新页面之后发现还有间距,解决方案是双击这个边界设置的属性,

选择first item 或者是第三行的点开有出现relative的,把relative to margin反选(把勾选去掉)。


2

4.xib中tableview上边有间距区域,反选Adjust Scroll View Insets

3

5.错误提示

5.1 Unsatisfiable Layouts 针对一个UI元素,有多个冲突的layout

5.2 Ambiguous Layouts 模糊的 少了某个位置信息或者是某个尺寸信息

控制台设置断点,调试缺失

self.tableview haaAmbiguousLayout

定位缺失信息,返回NO则没有缺失

当返回YES时候

self.tableView exerciseAmbiguityInLayout

5.3Logical Errors 逻辑错误,

关联间距错误

还有1,2,3中提到的都是逻辑错误

6.NSLayoutConstraint 的基础使用方法

_btnRed.translatesAutoresizingMaskIntoConstraints = false;
NSLayoutConstraint * constraintTopRed = [NSLayoutConstraint constraintWithItem:_btnRed attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.btnGreen attribute:NSlayoutAttributeBottom multiplier:1.0 constant:60];
[self.view addConstraint:constraintTopRed];

上述代码实现额功能是,将_btnRed的顶部设置为距离_btnGree底部60个像素的位置。代码量太大,不建议使用。

7.VFL语法(官方正版):

H:|-[icon]-20-[iconLabel]-20-[iconDate]-|

H: 表示水平方向

|-表示距离父视图左对齐,间距为0

H:|-[icon] 表示UI元素icon距离父视图,左边对齐

[icon]-20-[iconLabel] 表示 UI元素icon和iconLabel之间的间距是20

[iconDate]-| 表示UI元素右对齐父视图,间距为0

实际操作


NSArray * constraintsForGreen = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[_btnGreen]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_btnGreen)];
[self.view addConstraints:constraintsForGreen];

NSArray * constraintsForRed = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[_btnGreen]-60-[_btnRed]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(_btnGreen,_btnRed)];
[self.view addConstraints:constraintsForGreen];

8.真正的技术 Masonry

常规操作

pod init 
pod search Masonry
pod install  --no-repo-update

实际操作

[_btnGreen mas_makeConstraints:^(MASConstraintMaker *make){
make.centerX.equlTo(self.view);
make.top.equlTo(@100);

//额外适配

make.top.equalTo(@100);

make.height.equalTo(@100);

make.width.equalTo(@48);



}];

[_btnRed mas_makeConstraints:^(MASConstraintMaker *make){
make.centerX.equalTo(self.View);
make.top.equalTo(_btnGreen.mas_bottom).offset(60);

//额外适配,注意这里写的_btnGreen而不是btnGreen.height

make.top.equalTo(_btnGreen);

make.height.equalTo(_btnGreen);

make.width.equalTo(_btnGreen);

}];

Demo拉取地址:
https://gitee.com/xgkp/Masonry.git

自定义View,CustomView
创建一个_btnTest

#import "CustomView.h"
#import "Masonry.h"
@interface CustomView()
@property (nonatomic,strong) UIButton * btnTest;

@property (nonatomic,assign) int btnWidth;

@end

@implementation CustomView
-(instancetype)init
{
    self = [super init];
    if (self) {
        self.btnTest = [UIButton new];
        _btnTest.backgroundColor = [UIColor cyanColor];
        [self addSubview:_btnTest];
        
        _btnWidth = 100;
        
        [_btnTest addTarget:self action:@selector(clickAction) forControlEvents:(UIControlEventTouchUpInside)];
    }
    return self;
}

+(BOOL)requiresConstraintBasedLayout
{
//    告诉UIKit系统,将使用AutoLayout来进行布局处理
    return YES;
}

//初始化时候会调用一次这个方法
- (void)updateConstraints
{
    
    
    [_btnTest mas_remakeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(@60);
        make.width.equalTo(@(_btnWidth));
        make.centerX.equalTo(self);
        make.height.equalTo(@79);
    }];
    
        [super updateConstraints];
    
}



-(void)clickAction
{
//    [_btnTest mas_updateConstraints:^(MASConstraintMaker *make) {
//        make.width.equalTo(@160);
//    }];
    _btnWidth = 180;
    [self setNeedsUpdateConstraints];
}
@end


viewdidLoad中

#import "ViewController.h"
#import "CustomView.h"
#import "Masonry.h"
@interface ViewController ()
@property (nonatomic,strong) CustomView *customView;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.customView = [CustomView new];
    [self.view addSubview:_customView];
    _customView.backgroundColor = [UIColor grayColor];
    [_customView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(self.view.mas_top).offset(100);
        make.left.equalTo(@20);
        make.right.equalTo(@-20);
        make.bottom.equalTo(@-20);
    }];
    
    
}
@end

总体来讲看使用习惯了,个人来讲使用xibInterfaceBuilder多一点,多复杂的页面都可以快速搞定。

性能上来讲,如果涉及到scrollview上的多个子页面,xibInterfaceBuilder可能会出现卡顿,这时候,使用Masonry就是最优解

上一篇下一篇

猜你喜欢

热点阅读