VFL演示樣例

上篇文章向大家介紹了VFL的基本的語(yǔ)法點(diǎn)，假設(shè)對(duì)下面演示樣例不熟的童鞋，能夠前去參考。廢話不多說(shuō)。我們直接來(lái)看演示樣例。

演示樣例一

將五個(gè)大小同樣、顏色不同的view排成一行，view間的間隔為15px,第一個(gè)view的間隔與屏幕的左邊間隔10px,最后一個(gè)view的間隔與屏幕的右邊間隔也為10px。

//依據(jù)屏幕的寬度。計(jì)算view的寬度和高度CGFloat width = ([[UIScreen mainScreen] bounds].size.width-2*10-4*15)/5;CGFloat height = width;//固定第一個(gè)viewUIView *firstView = [UIView new];firstView.backgroundColor = [UIColor blackColor];// 將次屬性設(shè)置為NO,表示將使用AutoLayout的方式來(lái)布局firstView.translatesAutoresizingMaskIntoConstraints = NO;[self.view addSubview:firstView];//------使用VFL為第一個(gè)view加入約束------//在水平方向上，讓firstview的左邊與父視圖的左邊間隔10px,且自身寬度為widthNSArray *constraints1 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[firstView(==width)]" options:0 metrics:@{@"width":@(width)} views:NSDictionaryOfVariableBindings(firstView)];//在垂直方向上，讓firstView的上邊與父視圖的上邊間隔100px,且自身的高度為heightNSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[firstView(==height)]" options:0 metrics:@{@"height":@(height)} views:NSDictionaryOfVariableBindings(firstView)];[self.view addConstraints:constraints1];[self.view addConstraints:constraints2];//定義一個(gè)顏色數(shù)組NSArray *colors = @[[UIColor redColor],[UIColor orangeColor],[UIColor yellowColor],[UIColor blueColor]];//定義一個(gè)views數(shù)組NSMutableArray *views = [NSMutableArray array];[views addObject:firstView];for (int i = 0; i < 4; i++) {UIView *view = [UIView new];view.backgroundColor = colors[i];view.translatesAutoresizingMaskIntoConstraints = NO;[self.view addSubview:view];[views addObject:view];}//依次給views數(shù)組中的view使用vfl加入約束for (int i = 1; i < views.count; i++) {UIView *view1 = views[i-1];UIView *view2 = views[i];NSDictionary *bindings = NSDictionaryOfVariableBindings(view1,view2);NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view1]-15-[view2(==width)]" options:0 metrics:@{@"width":[NSNumber numberWithFloat:width]} views:bindings];[self.view addConstraints:constraints];}UIView *view1 = views[0];for (int i = 0; i < views.count; i++) {UIView *view2 = views[i];NSDictionary *bindings = NSDictionaryOfVariableBindings(view1,view2);NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[view2(==view1)]" options:0 metrics:nil views:bindings];[self.view addConstraints:constraints];}

效果截圖:

---

下篇演示樣例將會(huì)是使用VFL對(duì)登錄界面進(jìn)行布局，喜歡我的博客的童鞋能夠關(guān)注一波！

posted on 2017-07-07 15:51 mthoutai 閱讀(...) 評(píng)論(...) 編輯 收藏

轉(zhuǎn)載于:https://www.cnblogs.com/mthoutai/p/7132606.html

總結(jié)

以上是生活随笔為你收集整理的VFL演示样例的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。