IOS中AutoLayout

•AutoLayout是一種基於約束的，描述性的佈局系統

–基於約束：和以往定義frame的位置和尺寸不一樣，AutoLayout的位置肯定是以所謂相對位置的約束來定義的，好比x座標爲superView的中心，y座標爲屏幕底部上方10像素等

–描述性：約束的定義和各個view的關係使用接近天然語言或者可視化語言的方法來進行描述

–佈局系統：用來負責界面的各個元素的位置。

•

•AutoLayout爲開發者提供了一種不一樣於傳統對於UI元素位置指定的佈局方法。之前，不管是在IB裏拖放，仍是在代碼中寫，每一個UIView都會有本身的frame屬性，來定義其在當前視圖中的位置和尺寸。而使用AutoLayout，就變爲了使用約束條件來定義view的位置和尺寸。

AutoLayout的優點：

•解決不一樣分辨率和屏幕尺寸下view的適配問題，同時也簡化了旋轉時view的位置的定義。原來在底部之上10像素居中的view，不論在旋轉屏幕或是更換設備（iPad、iPad mini、iPhone 4或者是iPhone5）的時候，始終還在底部之上10像素居中的位置，不會發生變化

•

•使用約束條件來描述佈局，view的frame會依據這些約束來進行計算。

 

建立約束：

+ (id)constraintWithItem:attribute:relatedBy:toItem: attribute:multiplier:constant:

 

參數說明：

WithItem:要約束的對象

attribute:對象的佈局屬性

relatedBy:佈局關係

toItem:參照對象

attribute:參照對象的佈局屬性

multiplier:乘數

constant:常數

 

自動佈局的核心公式

Object1.property1=（object2.property2*multiplier）+constant value

 

————————————————————————————————————————

•添加約束

-(void)addConstraint:(NSLayoutConstraint *)constraint

 

•刷新約束的改變

-setNeedsUpdateConstraints

-layoutIfNeeded

[button setTranslatesAutoresizingMaskIntoConstraints:NO];

------------------------------------------------------------------------------

// 2.1 水平方向的約束

NSLayoutConstraint *constraintX = [NSLayoutConstraint constraintWithItem:button attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1.0f constant:0.0f];

 

[self.view addConstraint:constraintX];

 

// 2.2 垂直方向的約束

NSLayoutConstraint *constraintY = [NSLayoutConstraint

=========================================

測試演練5——VFL演練（1）

// 1. 建立三個按鈕：top、center、bottom

// 2. 三個按鈕寬度爲100點

// 3. 三個按鈕距離屏幕右側20點

// 4. bottom按鈕距離屏幕底部20點，每一個按鈕縱向間距爲20點

NSDictionary *viewDict = NSDictionaryOfVariableBindings(top, center, bottom);

 

NSArray *consh1 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[top(100)]-20-|" options:0 metrics:nil views:viewDict];

……

 NSArray *consv = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[top(40)]-20-[center(40)]-20-[bottom(40)]-20-|" options:0 metrics:nil views:viewDict];

……