一 概述

• 用代碼實現AutoLayout的步驟過程
• AutoLayout約束規則
• AutoLayout約束示例

二 用代碼實現AutoLayout的過程

2.1 實現AutoLayout的過程

• 通過代碼創建要進行AutoLayout約束的View
• View.translatesAutoresizingMaskIntoConstraints=NO;
• 根據邏輯添加約束方法：constraintWithItem:(id)view1 attribute:(NSLayoutAttribute)attr1…
• 添加約束對象到相應的view上

2.2 方法說明

創建約束對象的常用方法

+(id)constraintWithItem:(id)view1 attribute:(NSLayoutAttribute)attr1 relatedBy:(NSLayoutRelation)relation toItem:(id)view2 attribute:(NSLayoutAttribute)attr2 multiplier:(CGFloat)multiplier constant:(CGFloat)c;

說明：

• view1 ：要約束的控件
• attr1 ：約束的類型（做怎樣的約束）
• relation ：與參照控件之間的關系
• view2 ：參照的控件
• attr2 ：約束的類型（做怎樣的約束）
• multiplier ：乘數
• c ：常量

自動布局有個核心公式：obj1.property1 =（obj2.property2 * multiplier）+ constant value

添加約束對象到相應的view上

- (void)addConstraint:(NSLayoutConstraint *)constraint; - (void)addConstraints:(NSArray *)constraints;

注意點

• 要先禁止autoresizing功能，設置view的下面屬性為NO view.translatesAutoresizingMaskIntoConstraints = NO;
• 添加約束之前，一定要保證相關控件都已經在各自的父控件上
• 不用再給view設置frame

三 AutoLayout約束規則

在創建約束之后，需要將其添加到作用的view上

在添加時要注意目標view需要遵循以下規則：

3.1 對于兩個同層級view之間的約束關系，添加到它們的父view上

3.2 對于兩個不同層級view之間的約束關系，添加到他們最近的共同父view上

3.3 對于有層次關系的兩個view之間的約束關系，添加到層次較高的父view上

四 AutoLayout約束示例

4.1 代碼

#import "ViewController.h"@interface ViewController ()@end@implementation ViewController- (void)viewDidLoad {[super viewDidLoad];//1-添加兩個控件到父空間上//1.1-藍色ViewUIView *blueView=[[UIView alloc]init];blueView.backgroundColor=[UIColor blueColor];[self.view addSubview:blueView];blueView.translatesAutoresizingMaskIntoConstraints=NO;//1.2-紅色ViewUIView *redView=[[UIView alloc]init];redView.backgroundColor=[UIColor redColor];[self.view addSubview:redView];redView.translatesAutoresizingMaskIntoConstraints=NO;//2-添加約束/** @Item:==first item，需要約束的條件* @attribute：需要設置的約束* @relatedBy==relation,等于* @toItem=second item,被參考的控件* @attribute：需要設置的約束* @multiplier：乘以* @constant：加上*///2.1 添加藍色View距離父控件左邊距固定為20--藍色View的左邊等于父控件的左邊*1.0+20NSLayoutConstraint *blueViewLeft= [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeft multiplier:1.0 constant:20];[self.view addConstraint:blueViewLeft];//2.2 添加藍色View距離父控件右邊距固定為20,--藍色View的右邊等于父控件的右邊*1.0-20NSLayoutConstraint *blueViewRight= [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeRight multiplier:1.0 constant:-20];[self.view addConstraint:blueViewRight];//2.3 添加藍色View距離父控件上邊距固定為20，--藍色View的上邊等于父控件的上邊*1.0+20NSLayoutConstraint *blueViewTop= [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTop multiplier:1.0 constant:20];[self.view addConstraint:blueViewTop];//2.4 添加藍色View高度為50，--藍色View的高度等于50NSLayoutConstraint *blueViewHeight= [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeHeight multiplier:1.0 constant:50];[self.view addConstraint:blueViewHeight];//3-設置紅色View//3.1 紅色View的高度和藍色View的高度一樣 高度--紅色View的高度等于紅色View的高度NSLayoutConstraint *redViewHeight= [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeHeight multiplier:1.0 constant:0];[self.view addConstraint:redViewHeight];//3.2 紅色的右邊和藍色的右邊對齊 x-紅色View的右邊等于紅色View的右邊NSLayoutConstraint *redViewRight= [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeRight multiplier:1.0 constant:0];[self.view addConstraint:redViewRight];//3.3 紅色的頂部和藍色的地步距離固定 y-紅色View的頂部等于紅色View的底部+20NSLayoutConstraint *redViewTop= [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeBottom multiplier:1.0 constant:20];[self.view addConstraint:redViewTop];//3.4 紅色的寬度等于藍色寬度的一般 寬度-紅色View的寬度等于紅色View的寬度*0.5NSLayoutConstraint *redViewWidth= [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeWidth multiplier:0.5 constant:0];[self.view addConstraint:redViewWidth];} @end

4.2 效果圖

豎屏橫屏

總結

以上是生活随笔為你收集整理的IOS开发之——屏幕适配-AutoLayout代码实现(03)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。