ios 自動布局添加删除限制

目錄

|-限制方法

|-删除限制

|-布局示例

|–|-第一種 constraintWithItem

|–|-第二種 VFL

|–|-第三種 Masonry

|-問題記錄

限制方法

NSLayoutConstraint *constraint = [NSLayoutConstraint constraintWithItem:playBtn // 要添加限制的view
attribute:NSLayoutAttributeWidth // 要添加的限制屬性
relatedBy:NSLayoutRelationEqual // 限制關系
toItem:nil // 參照的view
attribute:NSLayoutAttributeNotAnAttribute // 參照視圖的屬性
multiplier:1.0 // 倍數
constant:126.0]; // 數值

[playBtn addConstraint:constraint]; // 添加限制

           

删除限制

// 删除限制
for (NSLayoutConstraint *constraint in playBtn.constraints) {
        if (constraint.firstAttribute == NSLayoutAttributeWidth) {
            [playBtn removeConstraint:constraint];
        }
    }
           

下面列出三種代碼自動布局的方式

重要：使用AutoLayout的方式來布局必須要設定該屬性，否則布局無效。

[label setTranslatesAutoresizingMaskIntoConstraints:NO];
           

在contentView上添加一個view

1、第一種方式

UIView *topView = [[UIView alloc] init];
        [self.contentView addSubview:topView];
        
        // view 左側和父視圖對齊
        [self.contentView addConstraint:
         [NSLayoutConstraint constraintWithItem:topView
                                      attribute:NSLayoutAttributeLeft
                                      relatedBy:NSLayoutRelationEqual
                                         toItem:self.contentView
                                      attribute:NSLayoutAttributeLeft
                                     multiplier:1 constant:0]];
		// view 頂部和父視圖對齊
        [self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:topView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.contentView attribute:NSLayoutAttributeTop multiplier:1 constant:0]];
        // view 右側和父視圖對齊
        [self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:topView attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:self.contentView attribute:NSLayoutAttributeRight multiplier:1 constant:0]];
        // view 高度設為20
        // 沒有參照視圖，toItem 設為nil，toItem 後面的 attribute 設為 NSLayoutAttributeNotAnAttribute
        [self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:topView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1 constant:20]];
        
        topView.backgroundColor = [UIColor redColor];
        
        // AutoLayout 布局會和 Autoresizing 沖突而不起作用，是以這裡把 Autoresizing 設為NO
        [topView setTranslatesAutoresizingMaskIntoConstraints:NO];
           

constraintWithItem:函數這篇文章介紹的很詳細了，留個傳送門。

2、第二種方式

// 去除布局安全邊距，讓視圖邊緣貼近螢幕邊緣
		self.contentView.preservesSuperviewLayoutMargins = NO;
		// 不顯示安全邊距，依然會有 UIEdgeInsetsMake(8, 8, 8, 8) 的邊距，設為0；
        self.contentView.layoutMargins = UIEdgeInsetsMake(0, 0, 0, 0);
        
        UIView *topView = [[UIView alloc] init];
        [self.contentView addSubview:topView];
        
        // topView 左側右側對齊父視圖
        [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[topView]-|" options:0 metrics:nil views:@{@"topView": topView}]];
		// topView 頂部對齊父視圖，高度為20
        [self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[topView(20)]" options:0 metrics:nil views:@{@"topView": topView}]];
        
        // AutoLayout 布局會和 Autoresizing 沖突而不起作用，是以這裡把 Autoresizing 設為NO 
        [topView setTranslatesAutoresizingMaskIntoConstraints:NO];
           

3、第三種方式（Masonry）

UIView *topView = [[UIView alloc] init];
    [self.contentView addSubview:topView];
    [topView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.top.right.equalTo(self.contentView);
        make.height.equalTo(@20);
    }];
	
	topView.backgroundColor = [UIColor redColor];
           

當然還可以使用storyboard。

前兩種是系統提供的方法，Masonry也是封裝了系統的方法，讓UI布局更簡單。了解系統的布局方式可以友善了解Masonry的工作原理。

問題記錄

H:|-[view]-|
           

H:|-0-[view]-0-|