無極五開戶_Sketch 62 Beta版本探秘,看看都有什麼新功能!

Sketch 推出了 62 Beta 版本來迎接 2020。從一月的 53 開始到現在,總共推出了 10 個大版本更新。下面就一起看下 62 版本的新功能。

Sketch最新Beta版本下載

如果想知道 61 版本的新功能,請看這篇文章:

Sketch 61 Beta版本探秘,看看都有什麼新功能!

11 月還沒結束,Sketch61 就已經出來了,距離 60 版本發布才半個多月。今天一起看下 61 新增了哪些功能。

閱讀文章 >>

如果想體驗 Sketch 最新 Beta 版本,請進入 Sketch 測試版主頁下載 https://www.sketch.com/beta/。但是要記住,一定不要用在自己的正式文件中,防止修改后,低版本打不開。

Sketch 62 要求 Mac 系統版本是 macOS High Sierra 10.13.4 及以上,下面是 Sketch 各大版本對應的 Mac 系統版本,如果遇到新版的 Sketch 打不開就需要檢查下自己的系統版本。

智能布局新增最大值和最小值

自從 Sketch58 新增了 Smart Layout 智能布局功能后,UI 設計師可以很方便地通過製作彈性組件來應對各種不同狀態的需求。

在新建 Symbol 組件時,彈窗新增 Layout 選項,總共有 7 個屬性,分別對應不同的圖標,下面是每個屬性的簡單介紹。具體用法可以看下這篇文章:

Sketch 58 Beta版本探秘,看看都有什麼新功能!

Sketch 58 Beta 版本已於近期發布,官方終於推出 Smart Layout 智能布局,讓 Symbol 組件獲得響應功能,變得更加靈活和強大。

閱讀文章 >>

Sketch62 版本的智能布局新增了最大值和最小值功能,選擇好布局方式后,就可以在右側屬性面板區域設置。這裏的最大值和最小值規定了智能布局對象的兩個臨界點,可以分別單獨設置。

水平布局設置寬度的最大和最小值:

垂直布局設置高度的最大和最小值:

那麼這個最大值和最小值對我們的工作有什麼實際作用呢?

兩種寬度按鈕

這裏用上圖中最常見的按鈕組件作為例子。

我們經常使用的按鈕是固定寬度按鈕,和字數多少沒關係(當然要在合理範圍之內)。例如下圖,按鈕寬度是80,不管是多少字,寬度始終不變。好處是整齊、標準,容易排版布局。

固定寬度按鈕在CSS代碼中,直接把寬度寫死文字居中即可,比如  width:80px

另一種按鈕是彈性寬度按鈕,兩端留固定的邊距,字數越多寬度越大。好處是靈活,遇到極端特殊情況不至於文本溢出。

彈性寬度按鈕在 CSS 代碼中就不能寫具體的寬度數值了,而是要使用padding-left和padding-right,即左邊距和右邊距。例如上圖的彈性按鈕可以寫成

padding-left:16px
padding-right:16px

最小寬度的彈性按鈕

但是在實際工作中也會遇到這樣的問題:正常字數,常見的2、3、4個字,按鈕寬度固定,比如始終保持80寬,這樣可以滿足大多數需求。遇到極端情況,比如8個字,我們需要讓按鈕兩端始終保持邊距16,寬度跟着字數多少走,但不能小於80,這個該怎麼辦呢?

在Sketch62版本之前,我們可以設置按鈕為水平智能布局,字數少寬度小,字數多寬度就長,如果想保持一個最小寬度,比如2、3、4個字保持80的寬度,那麼我們需要手動拉伸按鈕,但這樣的話會破壞彈性寬度,治標不治本。

Sketch62版本更新的最大值和最小值功能就可以完美解決這個問題。

比如設置寬度最小值為80,就是說這個智能布局規定了對應按鈕Symbol最小寬度是80,不能再小了。接下來試着改變数字。

可以看到,由於設置了最小寬度為80,按鈕中即使只有一個字,寬度也會始終不會小於80,這就是最小值的作用。

最大值同樣的道理,只要設置好對應數值,在不手動拉伸的情況下,寬度不會超過設置的最大值。

實際上,Sketch這次增加的最大值和最小值,比如寬度,對應CSS中的max-width和min-width兩個屬性,也是Web前端中比較常用的。

文檔保存優化

Sketch62中保存文檔時會新增兩個選項,分別是:保存在本地電腦和保存在Sketch Cloud。

還有其他的一些更新點,也主要是對Sketch Cloud 的優化,可見在Figma的追趕下,Sketch也逐步重視雲端的相關功能。

總結

前有Figma的攻城略地,後有Adobe XD的緊追不舍,2020年Sketch將會給我們UI設計師帶來哪些新功能和新的設計工作流呢?讓我們拭目以待。

歡迎關注作者的微信公眾號:「UI黑客」

未经-摩登3注册-摩登3测速官网-允许不得转载:摩登3注册-摩登3测速官网 » 無極五開戶_Sketch 62 Beta版本探秘,看看都有什麼新功能!

赞 (0)