排版是設(shè)計(jì)師重要的工作內(nèi)容之一，比如說，修改按鈕文字要排版、調(diào)整順序要排版、適配多種屏幕要排版，設(shè)計(jì)師們不是在排版就是在排版的路上。但設(shè)計(jì)師不應(yīng)該花太多的時(shí)間在排版上，想讓排版這件事變得更輕松，一定要試試 MasterGo 自動(dòng)布局功能。
舉個(gè)例子，以往設(shè)計(jì)師在設(shè)計(jì)一個(gè)按鈕時(shí)，當(dāng)文字長度發(fā)生變化，需要手動(dòng)重新調(diào)整按鈕的寬高尺寸。而通過 MasterGo 添加自動(dòng)布局后，修改按鈕內(nèi)的文字時(shí)，按鈕會(huì)自動(dòng)跟隨文字長短變化寬高。
或者說，B 端設(shè)計(jì)師會(huì)經(jīng)常遇到表格設(shè)計(jì)需求，做好表格后，有時(shí)會(huì)需要增加或者刪除某一行，或者調(diào)整某一行的順序，以往只能手動(dòng)挪動(dòng)多行來變更層級順序，增刪之后還需要重新調(diào)整表格高度。通過 MasterGo 添加自動(dòng)布局后，增加、刪除某行時(shí)，表格會(huì)自動(dòng)調(diào)整尺寸。想要改變表格中某行的順序，只需按方向鍵上、下移動(dòng)某行就搞定了。
以及，卡片作為設(shè)計(jì)中經(jīng)常會(huì)遇到的組件，通常情況下，卡片內(nèi)容需要隨著卡片寬度的變化調(diào)整，這樣才能更好地適配跨設(shè)備的不同屏幕。通過 MasterGo 添加自動(dòng)布局后，不需要為不同屏幕尺寸設(shè)計(jì)不同的卡片樣式，拉伸容器就能讓它跟隨你的心意變化。
自動(dòng)布局雖然看起來很復(fù)雜，但如果明白了其中原理，用起來會(huì)非常簡單高效。接下來小編就通過 4 個(gè)操作步驟，帶領(lǐng)大家一起體驗(yàn)自動(dòng)魔法的奧秘。
首先，在 MasterGo 設(shè)計(jì)模式下，選擇一個(gè)容器或者多個(gè)圖層后，設(shè)計(jì)師們有三種方式可以創(chuàng)建自動(dòng)布局容器：點(diǎn)擊右側(cè)屬性面板中自動(dòng)布局的“ + ”，右鍵菜單列表中選擇“添加自動(dòng)布局”，或者使用快捷鍵Shift + A。
其次，設(shè)計(jì)師們可以在畫布中或者自動(dòng)布局面板中調(diào)整自動(dòng)布局內(nèi)圖層間的距離（自動(dòng)布局容器內(nèi)，圖層與圖層之間的距離稱為間距，圖層與容器邊框之間的距離稱為邊距）。
如果想要在右側(cè)面板處修改間距或邊距，設(shè)計(jì)師可以在右側(cè)欄自動(dòng)布局面板中手動(dòng)修改或直接按住間距圖標(biāo)左右拖動(dòng)調(diào)整【間距】【上下邊距】【左右邊距】的數(shù)值，讓容器內(nèi)所有小框按照你希望的間距排列。點(diǎn)擊【展開】圖標(biāo)還可以逐一調(diào)整容器與內(nèi)部元素的上、下、左、右邊距，滿足不同調(diào)整需求。
如果想在畫布上修改間距或邊距，設(shè)計(jì)師可以先選中一個(gè)自動(dòng)布局，然后在畫布中能夠很直觀地看到間距和邊距的調(diào)節(jié)手柄，拖動(dòng)手柄就可以快速調(diào)節(jié)間距和邊距了。當(dāng)然，也可以像在右側(cè)屬性面板上的操作一樣，點(diǎn)擊手柄即可輸入數(shù)值來精確控制自動(dòng)布局內(nèi)圖層之間的距離。值得注意的是，當(dāng)間距為負(fù)數(shù)時(shí)，此時(shí)圖層之間會(huì)形成堆疊效果。
當(dāng)然，MasterGo 自動(dòng)布局還提供了多種對齊的方式。設(shè)計(jì)師選中自動(dòng)布局容器時(shí)，在對齊面板中選擇對齊方式，自動(dòng)布局內(nèi)的所有子圖層會(huì)按照所選方式進(jìn)行對齊。
最后，建議設(shè)計(jì)師們熟記一些MasterGo 的快捷鍵，比如「增加」可以通過快捷鍵 Command + D 來復(fù)制子圖層，「刪除」通過 Delete 鍵來刪除一個(gè)子圖層，「調(diào)整順序」通過方向鍵來快速調(diào)整圖層的順序。
以上就是 MasterGo 自動(dòng)布局的一些基礎(chǔ)操作，可以滿足設(shè)計(jì)師們一些簡單的響應(yīng)式效果。但是，想要實(shí)現(xiàn)更復(fù)雜的整體界面自動(dòng)響應(yīng)的效果，還需要進(jìn)一步掌握調(diào)整大小的組合技，嵌套容器大法等技巧，實(shí)現(xiàn)更高階的自動(dòng)魔法，設(shè)計(jì)師們可以通過 MasterGo 多嘗試、多體驗(yàn)、多創(chuàng)造！
