美文网首页
iOS中Constraint的屏幕适配方案

iOS中Constraint的屏幕适配方案

作者: 数字d | 来源:发表于2020-01-19 17:23 被阅读0次

    常规操作不赘述

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

    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就是最优解

    相关文章

      网友评论

          本文标题:iOS中Constraint的屏幕适配方案

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