要求1:水平排列等寬等間距4個(gè)按鈕
一, 拖拽按鈕
1, 拖拽一個(gè)按鈕到左上角位置(系統(tǒng)會(huì)有提示約束線出現(xiàn)的位置),如下圖所示
圖-1.png
2,接著拖拽第二個(gè)按鈕,緊鄰第一個(gè)按鈕的右側(cè),如下圖所示, 之后的按鈕以此類推
圖-2.png
3,拖拽完成4個(gè)按鈕,還沒有添加約束
圖-3.png
二, 添加缺少的約束
選中某一個(gè)按鈕,
1, 選擇 Resolve Auto Layout Isues (解決自動(dòng)布局沖突)
2, 選擇Add Missing Constraints (添加缺少的約束)
圖-4.png
三, 設(shè)置等寬
1, 選擇四個(gè)按鈕,選擇添加約束,設(shè)置等寬
圖-5.png
2, 選中最后一個(gè)按鈕, 添加右邊距,
圖-6.png
3, 修改最后一個(gè)按鈕的右邊距為8,
圖-7.png
這樣就完成了,靜態(tài)等間距,動(dòng)態(tài)等寬的一行多個(gè)按鈕的布局,你也可以修改間距,來達(dá)到具體的UI要求
要求二, 完成3行4列12宮格按鈕排列
1, 先按照上面的方法,完成第一行的布局
2, 然后按照上面的方法完成到(三.1),先不添加最后一個(gè)按鈕的右邊距,這時(shí)會(huì)有個(gè)警告,
圖-8.png
3, 第三行和第二行一樣
這樣就完成了要求二,如果想改變按鈕的寬度,可以通過改變按鈕的間距,會(huì)實(shí)現(xiàn)3行4列按鈕同時(shí)跟著改變位置
圖-9.png
