工作中發(fā)現(xiàn)，雖然僅使用Sketch 基礎(chǔ)功能也能很好的勝任設(shè)計(jì)工作，但是如果能掌握一些實(shí)用的小技巧則會(huì)讓你的工作更加輕松。所以從本期開始，會(huì)陸續(xù)寫一些關(guān)于 sketch 方面鮮為人知的小知識(shí)，可能會(huì)包括快捷操作，組件，庫(kù)，實(shí)用插件等等，希望這系列的文章能拋磚引玉，對(duì)大家有所啟發(fā)。
既然是冷知識(shí)，往往很難系統(tǒng)化的去梳理，可能會(huì)比較零散，所以大家看到感興趣的小技巧最好去動(dòng)手試下，應(yīng)該就能很快明白了。
每個(gè)人都有自己的使用習(xí)慣，套路，所以很難知道我寫的對(duì)你來(lái)說(shuō)是冷還是熱。我只是把我自己從第一次使用 sketch 到現(xiàn)在的過(guò)程中，覺(jué)得是比較冷門但又很實(shí)用的小技巧分享出來(lái)。所以，學(xué)到了就點(diǎn)個(gè)贊，老司機(jī)們就請(qǐng)見諒吧。
一、在屬性欄中快捷修改對(duì)象屬性
平時(shí)大家在修改對(duì)象時(shí)，可以選擇對(duì)象并直接進(jìn)行縮放，其結(jié)果往往容易出現(xiàn)偏差，比如小數(shù)像素，沒(méi)有對(duì)齊等等，直接在右側(cè)屬性欄通過(guò)數(shù)值來(lái)操作會(huì)方便很多。
1. 鼠標(biāo)、Shift、Option實(shí)現(xiàn)快速修改
主界面中的右側(cè)的屬性欄中可以單擊屬性值以快速遞增或遞減該值（注意要把鼠標(biāo)放在文字的上下方位內(nèi)，出現(xiàn)左右箭頭才可以快速修改）。如果按住 Shift鍵，Sketch 將相應(yīng)地將值遞增或遞減10倍，按住 Option鍵會(huì)將其增加/減少十分之一。
2. 屬性欄還能支持組合修改
支持簡(jiǎn)單數(shù)學(xué)公式，支持樣式單位L（中心點(diǎn)左對(duì)齊）R（中心點(diǎn)居右）C（中心點(diǎn)居中）M（中心點(diǎn)居中）T（中心點(diǎn)置頂）B（中心點(diǎn)底部對(duì)齊），支持圓角快速自定義（格式是X;Y;N;M，順序是左上-右上-右下-左下），能幫助快速精確調(diào)整，是不是很高級(jí)？
△ 數(shù)字+功能組合操作
△ 簡(jiǎn)單數(shù)學(xué)公式計(jì)算
△ 圓角快捷設(shè)置
二、圖層操作上的小技巧
在剛開始使用 sketch 時(shí)，經(jīng)常會(huì)發(fā)生誤操作，比如移錯(cuò)圖層。比如你一開始選擇到了某個(gè)圖層，移動(dòng)的時(shí)候還是把圖層組給移動(dòng)了，很頭疼。所以在多圖層堆疊時(shí)，有幾個(gè)快捷鍵技巧挺實(shí)用。
當(dāng)圖層深埋在一堆文件夾中時(shí)，可以直接按住 command+鼠標(biāo)左鍵，可以快速選擇組內(nèi)的圖層。
按住 Option，就會(huì)只選擇完全位于某個(gè)圖形區(qū)域內(nèi)的圖層，避免誤選。（舉個(gè)例子，在一個(gè)有底部背景大圖上移動(dòng)界面元素，但是又不想選中底部大圖，除了用鎖定圖層的方法解決這個(gè)問(wèn)題，按 Option 也能很方便的解決）
△ 多圖層堆疊的情況
△ 多選且不想移動(dòng)某些元素
同時(shí)按住 option+command 可以做到單獨(dú)移動(dòng)圖層，鼠標(biāo)焦點(diǎn)可以不在被選圖層上，如果不按這2個(gè)快捷鍵組合，在元素區(qū)域外是沒(méi)法移動(dòng)的，當(dāng)在界面中有大量圖層時(shí)，也可以避免誤操作到其他圖層。（筆者強(qiáng)烈推薦，這個(gè)組合鍵經(jīng)常用到，對(duì)于解決選擇移動(dòng)問(wèn)題非常有幫助）
如果有重疊圖層，尤其是上層把下層遮住時(shí)，要直接選擇它會(huì)比較麻煩，此時(shí)可以選擇最上層圖層右鍵選擇想要的圖層，結(jié)合前面提到的快捷鍵進(jìn)行移動(dòng)或者修改操作。
對(duì)齊圖層：Control-Command-V 垂直方向上的等分；Control-Command-H 水平方向上的等分，這個(gè)快捷鍵非常常用，比每次點(diǎn)擊右上角的對(duì)齊工具要方便很多。
調(diào)整圖層：對(duì)圖層放大縮小是一個(gè)經(jīng)常需要用到的操作，但是如果某些圖層帶有圖層樣式，比如描邊，投影，圓角這些，在直接縮放時(shí)并不能同時(shí)縮放，比如長(zhǎng)寬各為50px且描邊為10px的形狀改為長(zhǎng)寬100px的形狀時(shí)，其描邊還是為10px。那怎么解決這個(gè)問(wèn)題呢？
其實(shí) sketch 是有2種縮放形式，一種是直接縮放，不改變?cè)貥邮街恍薷幕緦傩源笮?；另一種是變換縮放，可以同時(shí)縮放基本屬性以及樣式屬性。操作方式是從菜單中選擇「 圖層」>「變換」>「縮放… 」（或按Command-K），這個(gè)對(duì) symbol 也有效果。
三、圖層約束技巧
首先看看什么是圖層約束，直接看圖吧，圖層約束能做到下面這種效果：
在做界面適配的時(shí)候是不是很方便，那具體如何做到呢？
1. 圖層縮放固定邊距
在元素屬性欄，可以找到約束設(shè)置，根據(jù)需要設(shè)置子元素與父元素之間的關(guān)系（注意事項(xiàng)：圖層約束必須是建立在圖層組中，如果沒(méi)有組的概念，則無(wú)法使用圖層約束；子父級(jí)關(guān)系是指參照關(guān)系，比如下圖中白色塊相對(duì)于底部的藍(lán)色塊，白色就是子級(jí)，藍(lán)色就是父級(jí)，而對(duì) resizing 的設(shè)置其實(shí)就是設(shè)置子級(jí)）
△ 子父級(jí)關(guān)系
△ Apple官方組件關(guān)于圖層約束的設(shè)置
2. symbol內(nèi)容自動(dòng)適應(yīng)
在輸入項(xiàng)里有光標(biāo)的情況下，能自動(dòng)根據(jù)內(nèi)容長(zhǎng)短改變位置。
四、圖形操作技巧
旋轉(zhuǎn)是需要經(jīng)常用到的操作，在 sketch 中也是有很多方式可以實(shí)現(xiàn)圖層旋轉(zhuǎn)，需要看情況來(lái)使用。
通過(guò)屬性欄的角度設(shè)置直接設(shè)置圓角值，在旋轉(zhuǎn)角度很明確的時(shí)候很方便。
通過(guò)工具欄上的旋轉(zhuǎn)選項(xiàng)進(jìn)行旋轉(zhuǎn)，優(yōu)點(diǎn)是選擇后可以在畫面上任何位置對(duì)對(duì)象進(jìn)行旋轉(zhuǎn)。
直接通過(guò)快捷鍵實(shí)現(xiàn)旋轉(zhuǎn)，按住 command鍵并拖動(dòng)對(duì)象其中一個(gè)控制柄即可旋轉(zhuǎn)，這個(gè)快捷操作，在需要多頻次調(diào)整旋轉(zhuǎn)時(shí)，會(huì)很實(shí)用。
另外，補(bǔ)充一點(diǎn)旋轉(zhuǎn)以外的小知識(shí)，在做變換的時(shí)候，comand鍵也很有用。它可以讓對(duì)象變換只從一個(gè)方向上調(diào)整。
五、蒙版技巧
在 sketch 中的蒙版功能很強(qiáng)大，不光對(duì)圖層可以使用蒙版，對(duì)圖層組也可以使用，但在蒙版組內(nèi)，新建任何圖層或者圖層組都會(huì)被自動(dòng)蒙版，有時(shí)候反而會(huì)成為麻煩。
有2種辦法可以解除蒙版：
1）把圖層或組拖出蒙版組之外，但是這樣會(huì)破壞元素結(jié)構(gòu)；
2）直接選擇想要解除的圖層，右鍵忽略底層蒙版即可，這樣做的好處是，可以不會(huì)破壞對(duì)象組織結(jié)構(gòu)。
在 sketch 中有2種形式的蒙版，一種是基于圖形，另一種是基于透明度來(lái)實(shí)現(xiàn)的，常用漸變來(lái)做圖片漸隱效果。這2個(gè)都很常用，就不過(guò)多贅述。
六、sketch文件壓縮
在源文件中使用很多高清圖后，往往會(huì)讓整個(gè) sketch 文件變的很大，一是傳輸不方便，另一個(gè)也會(huì)導(dǎo)致文件卡頓，反應(yīng)慢。此時(shí)可以使用圖層-圖片-最小尺寸來(lái)對(duì)文件進(jìn)行快速壓縮。
七、批量替換顏色
在進(jìn)行多頁(yè)面多畫板修改顏色時(shí)，在不是 symbol 的情況下，修改起來(lái)會(huì)很費(fèi)時(shí)間。其實(shí) sketch 內(nèi)置了批量修改顏色功能，只是可能用的人不多。
具體操作為：編輯——查找并替換顏色（option+command+F），需要注意顏色透明度，根據(jù)實(shí)際需要判斷是否勾選。
△ 圖片來(lái)源：sketch官網(wǎng)
八、快捷切換視圖
設(shè)計(jì)過(guò)程中，需要經(jīng)常切換不同視圖來(lái)查看設(shè)計(jì)內(nèi)容，簡(jiǎn)直超高頻的使用需求！所以對(duì)于這些快捷鍵必須要在這里提一句：
Command +1 完整展示頁(yè)面里的所有內(nèi)容，適合全局展示，查看一致性。
Command +2 將選中的元素放大到合適屏幕的尺寸，這個(gè)視圖有一個(gè)妙用就是可以把復(fù)制的元素直接復(fù)制到當(dāng)前元素的中間，這個(gè)特性非常實(shí)用，自己試過(guò)就知道了，肯定會(huì)有用到的地方。
Command +3 將選中的元素顯示在屏幕中央。
Command + 0 以實(shí)際像素模式預(yù)覽頁(yè)面，即在100%大小下看設(shè)計(jì)效果。
九、圖層對(duì)齊
圖層對(duì)齊也是經(jīng)常要用到的操作。直接與對(duì)象對(duì)齊的話，Sketch 會(huì)將圖層對(duì)齊到所有選定對(duì)象的最外層。但要將圖層與特定對(duì)象對(duì)齊，怎么操作呢？
比如想讓下圖中兩個(gè)元素以正方形為參照物進(jìn)行居中，那應(yīng)該先使用圖層列表中的鎖定按鈕或使用 Shift-Command-L 鎖定該圖層，然后再執(zhí)行對(duì)齊操作即可。
十、設(shè)置sketch形狀默認(rèn)值
剛開始使用 sketch 時(shí)，新建矩形，每次都會(huì)自帶描邊，然后再手動(dòng)關(guān)閉描邊，很麻煩。這個(gè)默認(rèn)值能改嗎？當(dāng)然可以。
操作：首先建一個(gè)不帶描邊的矩形，然后選擇 layer-style-set style as default （這個(gè)功能以前是放在 Edit 里的，更新后合并到了 style 中）。搞定，下次再新建形狀時(shí)就會(huì)以你剛設(shè)置的樣式作為默認(rèn)值了。
另外再多說(shuō)一句，文章中所提到的小技巧，一定要自己動(dòng)手去試試啊，要不然看過(guò)了你也還是用不到，不信？那就試試看。
好了，本期sketch冷知識(shí)就先介紹到這里，下一期可能會(huì)分享symbols和Libraries的相關(guān)冷知識(shí)，敬請(qǐng)期待~
官方參考
本文由 @彩云Sky 原創(chuàng)發(fā)布，未經(jīng)許可，禁止轉(zhuǎn)載。
