1. 基礎(chǔ)篇
-目的:用自動(dòng)布局(StoryBoard中)實(shí)現(xiàn)幾個(gè)View等分屏幕
-效果圖:
Snip20151130_3.png
-實(shí)現(xiàn)方法:
a.設(shè)置第一個(gè)view的約束(既灰色view),約束為上,左,下為0,0,0
b.設(shè)置第二個(gè)view的約束(既藍(lán)色view),約束為上,左,下為0,0,0
c.設(shè)置第三個(gè)view的約束(既粉色view),約束為上,左,下為0,0,0
d.設(shè)置第四個(gè)view的約束(既橘色view),約束為上,左,下,右為0,0,0,0
e.選中四個(gè)View,設(shè)定四個(gè)View為等寬,如圖
Snip20151130_4.png
2.進(jìn)階篇
- 目的:用自動(dòng)布局(StoryBoard中)實(shí)現(xiàn)幾個(gè)控件的等間距分割
-
效果圖:(簡版,約束版)(事例為距上方藍(lán)線的約束)
Snip20151130_6.png
Snip20151130_5.png
- 實(shí)現(xiàn)方法
小TIPS:這里使用自動(dòng)布局進(jìn)行等間距分割的時(shí)候,要借助輔助的view控件
a. 對微博icon設(shè)置約束,約束為,上,左,寬,高為18,50,30,30
b. 設(shè)置其他三個(gè)icon與微博icon等寬,等高,等水平
c. 設(shè)置豆瓣icon距離上,右的約束為18,50
d. 拖三個(gè)view到四個(gè)icon中間,如圖
Snip20151130_7.png
e.對三個(gè)view分別設(shè)定約束(相對于左側(cè)icon)為水平居中,等高,左右約束為0,0
Snip20151130_8.png
Snip20151130_9.png
f.最后對三個(gè)view(選中)設(shè)定等寬
g.更新約束看看效果吧
3. iOS9.0更新(StackView)
注:該方法只能適配iOS9.0系統(tǒng)
將StackView拖動(dòng)到StoryBoard中,設(shè)置好相應(yīng)的約束,這個(gè)view就相當(dāng)如一個(gè)容器,將想進(jìn)行等間距的控件放入StackView中,并設(shè)定屬性如圖
Snip20151130_10.png
效果圖:
Snip20151130_11.png
