AutoLayout
約束是蘋果官方給定得約束信息。對于這個約束和UIView+AutoLayout.h
延展的用法類似,不過加上了延展之后,不用寫VFL語言
下面先看看以autolayout
實現的效果為例我們講解一下
下面開始上代碼以用戶名和密碼為例,來說說,
UITextField * userNameTextFiled = [[UITextField alloc] init];
userNameTextFiled.borderStyle = UITextBorderStyleRoundedRect;
userNameTextFiled.placeholder = @"用戶名";
userNameTextFiled.translatesAutoresizingMaskIntoConstraints=NO;
[self.view addSubview:userNameTextFiled];
UITextField * userPwdTextFiled = [[UITextField alloc] init];
userPwdTextFiled.borderStyle = UITextBorderStyleRoundedRect;
userPwdTextFiled.placeholder = @"密碼";
userPwdTextFiled.translatesAutoresizingMaskIntoConstraints=NO;
[self.view addSubview:userPwdTextFiled];
在這里有兩點必須說明:
1:在對控件allo的時候我們一定忘掉設置他得CGRectMake
2:也是重中之重的,不然會導致嚴重的性能問題,一定要對當前控件的
translatesAutoresizingMaskIntoConstraints
的屬性設置為NO,不然無法使用。。。
首先看看這兩個約束的方法
- (void)addConstraint:(NSLayoutConstraint *)constraint NS_AVAILABLE_IOS(6_0); // This method will be deprecated in a future release and should be avoided. Instead, set NSLayoutConstraint's active property to YES.
- (void)addConstraints:(NSArray<__kindof NSLayoutConstraint *> *)constraints NS_AVAILABLE_IOS(6_0); // This method will be deprecated in a future release and should be avoided. Instead use +[NSLayoutConstraint activateConstraints:].
這里有兩個方法,一個是添加的數組,一個添加屬性約束,我們在用VFL約束的時候,一定要是用addConstraints
的約束方法名。。。。
下面開始說約束的VFL代碼
NSDictionary * views = NSDictionaryOfVariableBindings(userPwdTextFiled,userNameTextFiled);
NSDictionary *metrics = @{@"padding":@10,@"leftPadding":@10,@"rightPadding":@10,@"height":@40,@"width":@50};
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-30-[userNameTextFiled]-30-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(userNameTextFiled)]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-50-[userNameTextFiled(==40)]" options:0 metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-30-[userPwdTextFiled]-30-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(userPwdTextFiled)]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[userNameTextFiled]-40-[userPwdTextFiled(==userNameTextFiled)]" options:0 metrics:nil views:views]];
看到方法中有
參數為字典類型參數的views,他代表的是,你要添加約束的對象的集合。。切記一定要把你坐相對布局約束的對象添加進去。。。
參數為字典類型參數的metrics, 這里你可以隨意的設置你想要的間隔的屬性名稱。。。可以放在VFL的語言里隨意的加入
下面介紹VFL語言語法格式
H:代表水平方向 H:| 代表水平方向距離父視圖
V:代表垂直方向 V:| 代表垂直方向距離父視圖
H:[BackView(320)] 代表水平方向BackView的寬度為320
V:[BackView(320)] 代表垂直方向BackView的寬度為320
|-30-[userNameTextFiled]-30-|
代表userNameTextFiled控件距離父視圖水平方向的左邊和右邊的距離為30,
H:|-30-[userNameTextFiled]-30-|
V:|-50-[userNameTextFiled(==40)]
代表userNameTextFiled控件距離父視圖垂直方向的的距離為50 ,并且高度為40
設置某個控件作為父視圖 并設置距離
V:[userNameTextFiled]-40-[userPwdTextFiled(==userNameTextFiled)]
代表userPwdTextFiled控件距離 userNameTextFiled控件的垂直方向的距離為40 并且他的高度等于userNameTextFiled的高度
如果我們用上metrics
NSDictionary *metrics = @{@"padding":@30,@"leftPadding":@10,@"rightPadding":@10,@"height":@40,@"width":@50};//
我們在寫約束的時候就可以
H:|-padding-[firstButon(==width)]
V:[userPwdTextFiled]-padding-[firstButon(==height)]
注意的是!!!!!
我們在寫VFL語言的時候,
1:一定要確定后面views和metrics里頭包含的內容必須有我們要用到得屬性和view
2:我們在寫H , V的時候一定要大寫
,不然會報錯。。。。。
1:首先看
- (void)addConstraint:(NSLayoutConstraint *)constraintNS_AVAILABLE_IOS(6_0);// This method will be deprecated in a future release and should be avoided. Instead, set NSLayoutConstraint's active property to YES.
這個方法如何使用。。(本人覺得這個方法用起來很爽,東西太多。。。)
代碼如下
//垂直居中
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:BackView
attribute:NSLayoutAttributeCenterY
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeCenterY
multiplier:1
constant:0]];
//水平居中
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:BackView
attribute:NSLayoutAttributeCenterX
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeCenterX
multiplier:1
constant:0]];
//約束條件
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[BackView(320)]" options:0 metrics:metrics views:viewsButton]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[BackView(350)]" options:0 metrics:metrics views:viewsButton]];
上面的代碼就是他得用法,設置水平居中,設置垂直居中,在設置他得大小水平方向寬度為320,垂直方向高度為350,這樣就可以控制居中顯示。。。。
下面說一下具體參數
constraintWithItem:要設置的控件的名稱
attribute:要設置的控件的屬性
relatedBy:相對關系(NSLayoutRelationEqual)
toItem:相對于哪個視圖
attribute:相對于哪個視圖的屬性
multiplier:相對縮放比例
constant