對(duì)于UI設(shè)計(jì)師來(lái)說(shuō)，無(wú)論是項(xiàng)目稿件的優(yōu)化，還是界面版本的迭代，看似一些細(xì)節(jié)上的調(diào)整，經(jīng)常會(huì)牽一發(fā)而動(dòng)全身，工作量堪比重做。

　　如何減少重復(fù)性勞動(dòng)，讓元素間的適配更加智能，相信很多設(shè)計(jì)都用過(guò)自動(dòng)布局。

　　去年5月，Pixso上線的自動(dòng)布局功能，獲得了不少設(shè)計(jì)師的關(guān)注。最近，自動(dòng)布局功能又迎來(lái)重磅升級(jí)，Pixso自動(dòng)布局2.0正式發(fā)布。

　　對(duì)比歷史版本，自動(dòng)布局2.0采用全新的交互UI，功能的調(diào)用更加靈活，還新增絕對(duì)定位、負(fù)間距堆疊、畫(huà)布控件操作等功能，滿足多樣化布局需求，下面就一起來(lái)看看吧!

　　全新UI交互，操作更加便捷

　　自動(dòng)布局能夠建立高效的設(shè)計(jì)規(guī)范，在增加、刪除、修改一些元素后，無(wú)需重新調(diào)整相鄰元素位置和尺寸，智能適配組件間的布局。

　　Pixso自動(dòng)布局2.0的升級(jí)，重點(diǎn)優(yōu)化了界面的交互邏輯，設(shè)置集中分布、均勻分布2個(gè)選項(xiàng)，提供9個(gè)位置的對(duì)齊方式，還能設(shè)置獨(dú)立邊距，更加符合實(shí)際的應(yīng)用場(chǎng)景。

　　除了UI界面的優(yōu)化，Pixso還將元素的尺寸與響應(yīng)方式調(diào)整放在了基礎(chǔ)版面，當(dāng)選中不同的自動(dòng)布局元素，就會(huì)觸發(fā)選擇不同的自適應(yīng)方式，更加簡(jiǎn)潔高效。

　　02、支持絕對(duì)定位，元素任意擺放

　　遇到消息通知、播放按鈕等設(shè)計(jì)，需要把對(duì)應(yīng)元素插入自動(dòng)布局，元素就會(huì)自動(dòng)吸附到現(xiàn)有布局，按照現(xiàn)有布局的關(guān)系排列，無(wú)法做到任意擺放位置。

　　Pixso新增絕對(duì)定位功能，將任意元素拖動(dòng)到自動(dòng)布局，就能觸發(fā)絕對(duì)定位按鈕，即可不受現(xiàn)有布局的約束，將元素?cái)[放到任意位置。

　　當(dāng)然，搭配Pixso約束布局功能，可以任意選擇絕對(duì)定位參照坐標(biāo)，固定元素與組件間的對(duì)應(yīng)關(guān)系，讓界面布局更加智能。

　　03、支持負(fù)間距堆疊，拖動(dòng)修改間距

　　在界面的設(shè)計(jì)中，經(jīng)常需要設(shè)計(jì)一些重疊效果，但自動(dòng)布局無(wú)法設(shè)置負(fù)間距，排列順序也只能通過(guò)圖層進(jìn)行調(diào)節(jié)。

　　Pixso自動(dòng)布局2.0支持負(fù)間距堆疊功能，選擇需要重疊的元素后，可以通過(guò)間距設(shè)置或元素間的拖動(dòng)，將元素整齊堆疊在一起，做到便捷且高效。

　　除此以外，Pixso還即將上線圖層堆疊順序功能，僅需選中需要排列的元素，即可快速生成堆疊效果，還能調(diào)整圖層之間的堆疊順序，且不改變圖層間的位置，效率直接拉滿。

　　04、畫(huà)布控件交互，操作更加智能

　　在使用自動(dòng)布局的時(shí)候，經(jīng)常需要調(diào)整布局參數(shù)，很多設(shè)計(jì)師習(xí)慣在畫(huà)布上直接調(diào)整，所以畫(huà)布的交互邏輯就顯得至關(guān)重要。

　　Pixso優(yōu)化了自動(dòng)布局的畫(huà)布控件交互，將光標(biāo)移動(dòng)到自動(dòng)布局的元素之間，就會(huì)觸發(fā)紅色選取，拖動(dòng)鼠標(biāo)即可調(diào)節(jié)之間的間距，單擊還能輸入間距數(shù)字，無(wú)需移動(dòng)到功能面板進(jìn)行調(diào)節(jié)。

　　當(dāng)拖動(dòng)時(shí)按住Alt/Option，還能同時(shí)調(diào)整兩側(cè)內(nèi)邊距，交互邏輯更加智能。

　　總結(jié)

　　總體來(lái)說(shuō)，Pixso自動(dòng)布局2.0非常強(qiáng)大，基本上可以滿足日常的使用場(chǎng)景，再也不用一個(gè)個(gè)層級(jí)的嵌套，能夠大幅度提高效率。如果你也被稿件修改中的重復(fù)勞動(dòng)所困擾，可以登錄Pixso官網(wǎng)進(jìn)行體驗(yàn)。