iOS 的布局

iOS布局可以xib文件布局,也可以代碼布局,代碼布局一般使用第三方框架masonry
可以用pods導(dǎo)入masonry,在需要使用的文件里導(dǎo)入頭文件#import <Masonry.h>

1.masonry使用
masonry使用時,必須是在控件被addSubView之后在才能使用masonry布局約束,不然程序會崩
equalTo 等于
mas_equalTo 等于 參數(shù):一般傳入確定值
offset 偏移值
greaterThanOrEqualTo 大于或等于
lessThanOrEqualTo 小于或等于
make.top.equalTo(self.contentView).offset(8);等同 make.top.equalTo(self.contentView.mas_top).offset(8);

例:

if (!_typeLab) {
        _typeLab = [[UILabel alloc] init];
        _typeLab.text = @"類型";
        _typeLab.textColor = [UIColor orangeColor];
        _typeLab.font = [UIFont systemFontOfSize:12];
        [self.contentView addSubview:_typeLab];
        [self.typeLab mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(self.contentView).offset(8);
            make.left.equalTo(self.contentView).offset(8);
            make.height.mas_equalTo(40);
        }];
    }

2.當兩個label在同一行

if (!_typeLab) {
        _typeLab = [[UILabel alloc] init];
        _typeLab.text = @"類型";
        _typeLab.textColor = [UIColor orangeColor];
        _typeLab.font = [UIFont systemFontOfSize:12];
        [self.contentView addSubview:_typeLab];
        [self.typeLab mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(self.contentView).offset(8);
            make.left.equalTo(self.contentView).offset(8);
            make.height.mas_equalTo(40);
        }];
    }
if (!_nameLab) {
        _nameLab = [[UILabel alloc] init];
        _nameLab.font = [UIFont systemFontOfSize:12];
        _nameLab.text = @"名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱名稱";
        [self.contentView addSubview:_nameLab];
        [self.nameLab mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(self.contentView).offset(8);
            make.left.equalTo(self.typeLab.mas_right).offset(8);
            make.right.equalTo(self.contentView).offset(-8);
            make.height.mas_equalTo(40);
        }];
    }

這里先定義typeLab 當nameLab內(nèi)容過長,會壓縮nameLab,nameLab顯示不全,typeLab顯示全
因為在默認情況下,我們沒有設(shè)置各個布局的優(yōu)先級,那么它就會優(yōu)先顯示左邊的label,左邊的完全顯示后剩余的空間都是右邊的label,如果整個空間寬度都不夠左邊的label的話,那么右邊的label沒有顯示的機會了。


屏幕快照 2018-03-07 09.37.43.png

3.當多個約束有沖突

if (!_typeLab) {
        _typeLab = [[UILabel alloc] init];
        _typeLab.text = @"類型";
        _typeLab.textColor = [UIColor orangeColor];
        _typeLab.font = [UIFont systemFontOfSize:12];
        [self.contentView addSubview:_typeLab];
        [self.typeLab mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(self.contentView).offset(8);
            make.left.equalTo(self.contentView).offset(8);
            make.height.mas_equalTo(40);
        }];
    }
if (!_nameLab) {
        _nameLab = [[UILabel alloc] init];
        _nameLab.font = [UIFont systemFontOfSize:12];
        _nameLab.text = @"名稱名稱";
        [self.contentView addSubview:_nameLab];
        [self.nameLab mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(self.contentView).offset(8);
            make.left.equalTo(self.typeLab.mas_right).offset(8);
            make.right.equalTo(self.contentView).offset(-8);
            make.height.mas_equalTo(40);
        }];
    }

這里 make.left.equalTo(self.typeLab.mas_right).offset(8);與make.right.equalTo(self.contentView).offset(-8);有沖突 因為nameLab內(nèi)容短,這兩個約束不可能同時滿足,但代碼先執(zhí)行左邊約束make.left.equalTo(self.typeLab.mas_right).offset(8),后執(zhí)行右邊約束make.right.equalTo(self.contentView).offset(-8),后執(zhí)行的右邊約束會覆蓋左邊約束


屏幕快照 2018-03-07 09.43.57.png

當nameLab改成如下
[self.nameLab mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.contentView).offset(8);
// make.left.equalTo(self.typeLab.mas_right).offset(8);
make.right.equalTo(self.contentView).offset(-8);
make.left.equalTo(self.typeLab.mas_right).offset(8);
make.height.mas_equalTo(40);
}];
make.left.equalTo(self.typeLab.mas_right).offset(8);與make.right.equalTo(self.contentView).offset(-8);有沖突 因為nameLab內(nèi)容短,這兩個約束不可能同時滿足,但代碼先執(zhí)行右邊約束make.right.equalTo(self.contentView).offset(-8),后執(zhí)行左邊約束make.left.equalTo(self.typeLab.mas_right).offset(8), 有沖突就后執(zhí)行的左邊約束會覆蓋掉右邊約束


屏幕快照 2018-03-07 09.55.52.png

4.使用代碼設(shè)置優(yōu)先級
以下兩個約束是固有的約束
Content Hugging Priority: 該優(yōu)先級表示一個控件抗被拉伸的優(yōu)先級。優(yōu)先級越高,越不容易被拉伸,默認是251。
Content Compression Resistance Priority: 該優(yōu)先級和上面那個優(yōu)先級相對應(yīng),表示一個控件抗壓縮的優(yōu)先級。優(yōu)先級越高,越不容易被壓縮,默認是750

如果我們現(xiàn)在的需求是優(yōu)先顯示右邊的label,左邊的label內(nèi)容超出的省略,這時就需要我們調(diào)整約束的優(yōu)先級了。
默認情況下兩邊的label的Content Hugging和Content Compression優(yōu)先級都是一樣的,為了讓右邊的label完全顯示,那么我們需要增大右邊label的抗壓縮級,或者減小左邊label的抗壓縮級,總之是得讓右邊的抗壓縮級大于左邊的label,這樣才能讓右邊的label內(nèi)容優(yōu)先顯示。
UIView中設(shè)置抗壓或者抗拉伸的優(yōu)先級的方法:

  • (UILayoutPriority)contentHuggingPriorityForAxis:(UILayoutConstraintAxis)axis NS_AVAILABLE_IOS(6_0);

  • (void)setContentHuggingPriority:(UILayoutPriority)priority forAxis:(UILayoutConstraintAxis)axis NS_AVAILABLE_IOS(6_0);

  • (UILayoutPriority)contentCompressionResistancePriorityForAxis:(UILayoutConstraintAxis)axis NS_AVAILABLE_IOS(6_0);

  • (void)setContentCompressionResistancePriority:(UILayoutPriority)priority forAxis:(UILayoutConstraintAxis)axis NS_AVAILABLE_IOS(6_0);
    在初始化label里面添加代碼:
    [leftLabel setContentCompressionResistancePriority:UILayoutPriorityDefaultLow forAxis:UILayoutConstraintAxisHorizontal];
    或者
    [rightLabel setContentCompressionResistancePriority:UILayoutPriorityRequired forAxis:UILayoutConstraintAxisHorizontal];
    UILayoutPriority類型實際上就是float類型,只要設(shè)置右邊的比左邊的大就可以。
    例:

if (!_leftRemarkLab) {
        _leftRemarkLab = [[UILabel alloc] init];
        _leftRemarkLab.font = [UIFont systemFontOfSize:12];
        _leftRemarkLab.textColor = [UIColor orangeColor];
        _leftRemarkLab.text = @"描述描述描述描述描述描述描述描述描述描述描述描述描述描述";
        [self.contentView addSubview:_leftRemarkLab];
    }
    
    if (!_rightLab) {
        _rightLab = [[UILabel alloc] init];
        _rightLab.font = [UIFont systemFontOfSize:12];
        _rightLab.text = @"123344555656651";
        [self.contentView addSubview:_rightLab];
        
    [_leftRemarkLab mas_makeConstraints:^(MASConstraintMaker *make) {
            make.bottom.equalTo(self.contentView).offset(-8);
            make.left.equalTo(self.contentView).offset(8);
            make.height.mas_equalTo(40);
            make.right.lessThanOrEqualTo(self.rightLab.mas_right).offset(-8);
        }];
        
    [_rightLab mas_makeConstraints:^(MASConstraintMaker *make) {
            make.centerY.equalTo(self.leftRemarkLab);
            make.right.equalTo(self.contentView).offset(-8);
            make.left.greaterThanOrEqualTo(self.leftRemarkLab.mas_right).offset(8);
        }];
        
//設(shè)置抗壓優(yōu)先級的值高
   // [_rightLab setContentCompressionResistancePriority:UILayoutPriorityRequired forAxis:UILayoutConstraintAxisHorizontal];
        
//設(shè)置抗壓優(yōu)先級的值低
 [_leftRemarkLab setContentCompressionResistancePriority:UILayoutPriorityDefaultLow forAxis:UILayoutConstraintAxisHorizontal];
    }
屏幕快照 2018-03-07 10.23.34.png

參考:https://www.cnblogs.com/junhuawang/p/5691302.html

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容