安裝
下載安裝包
下載鏈接：https://pan.baidu.com/s/1cHEf8q
雙擊Sketch Measure.sketchplugin完成安裝
工具欄
一個(gè)集成了所有功能圖標(biāo)的工具欄，可以方便操作每一個(gè)功能
執(zhí)行 Plugin > Sketch Measure > Toolbar 或使用快捷鍵 control???+ shift???+?B
標(biāo)注區(qū)域
有時(shí)你可能需要標(biāo)注一個(gè)區(qū)域以突出該層，而這在 Sketch Measure 中很容易實(shí)現(xiàn)
在 Sketch 中選中一個(gè)或多個(gè)層
點(diǎn)擊工具欄上的?區(qū)域?按鈕或使用快捷鍵 control???+ shift???+?1
標(biāo)注尺寸
用于標(biāo)注一些圖層的寬度和高度
在 Sketch 中選中一個(gè)或多個(gè)層
點(diǎn)擊工具欄上的?尺寸?按鈕或使用快捷鍵 control???+ shift???+?2
對(duì)于寬度和高度，如果你想分別單獨(dú)標(biāo)注以及設(shè)置顯示方式
可以在按住 alt???鍵的同時(shí)點(diǎn)擊工具欄上的?尺寸?按鈕
標(biāo)注間隔
任何層與畫板之間的間距
選中在畫板上的一個(gè)層或選中任意兩個(gè)層
點(diǎn)擊工具欄上的?間隔?按鈕或使用快捷鍵 control???+ shift???+?3
如果你想分別單獨(dú)顯示頂部、右、底部或左的間距
可以在按住 alt???鍵的同時(shí)點(diǎn)擊工具欄上的?間隔?按鈕
標(biāo)注屬性
標(biāo)注圖層或文本層的信息，例如填充顏色、邊框顏色、不透明度字體和字號(hào)等
在 Sketch 中選中一個(gè)或多個(gè)層
點(diǎn)擊工具欄上的?屬性?按鈕或使用快捷鍵 control???+ shift???+?4
如果你想分別單獨(dú)標(biāo)注任何屬性
可以在按住 alt???鍵的同時(shí)點(diǎn)擊工具欄上的?屬性?按鈕
標(biāo)注備注
在畫板上標(biāo)注一些備注，在規(guī)范導(dǎo)出的查看器中展示
插入文本層，鍵入一些文本
選中文本層
點(diǎn)擊工具欄上的?備注?按鈕或使用快捷鍵 control???+ shift???+?5
設(shè)置切圖
快速設(shè)置層導(dǎo)出選項(xiàng)的預(yù)設(shè)和?規(guī)范導(dǎo)出?切片規(guī)格，例如下圖導(dǎo)出安卓資源
在 Sketch 中選中一個(gè)或多個(gè)層
點(diǎn)擊工具欄上的?設(shè)置切圖?按鈕或使用快捷鍵 control???+ shift???+?S
如果你想創(chuàng)建切片圖層
可以在按住 alt???鍵的同時(shí)點(diǎn)擊工具欄上的?設(shè)置切圖?按鈕
顏色命名
設(shè)置顏色命名和導(dǎo)出?.xml?文件給開發(fā)者
點(diǎn)擊工具欄上的?顏色命名?按鈕或使用快捷鍵 control???+ shift???+?C
在 Sketch 中選中一個(gè)或多個(gè)圖層或文本層
在第 1 步驟彈出的顏色管理對(duì)話框界面中點(diǎn)擊?+?按鈕
如果你想編輯顏色命名
在對(duì)話框界面中雙擊顏色項(xiàng)目即可
規(guī)范導(dǎo)出
一鍵自動(dòng)生成 HTML 頁(yè)面，離線下檢查所有設(shè)計(jì)細(xì)節(jié)，包括 CSS 樣式。
在 Sketch 中選中一些畫板
點(diǎn)擊工具欄上的?規(guī)范導(dǎo)出?按鈕或使用快捷鍵 control???+ shift???+?E
如果你創(chuàng)建一個(gè) HTML 文件一個(gè)畫板，請(qǐng)取消選中“高級(jí)模式”
規(guī)范查看器
你可以使用 Safari 9+ 或 Google Chrome 來(lái)查看, 導(dǎo)出的規(guī)范基于 HTML 5、CSS 3 和 Javascript 呈現(xiàn)
選中一個(gè)層并懸停在層上來(lái)測(cè)量和獲得間距
點(diǎn)擊位于規(guī)范查看器界面右側(cè)屬性檢查器的顏色區(qū)域可改變顏色格式
使用 command???+?+?和 command???+?-?來(lái)縮放畫布
摁住鍵盤空格鍵, 同時(shí)鼠標(biāo)拖拽畫布可平移畫布
切換備注開關(guān)可顯示和隱藏備注
在線演示:?http://utom.design/news/
注意事項(xiàng)
第一次執(zhí)行上述操作會(huì)彈出界面倍率和單位選擇對(duì)話框
選擇的倍率和單位基于當(dāng)前畫板尺寸，如 Sketch 默認(rèn) iPhone 7 畫板 375x667px 的倍數(shù)和單位分別為 1 和 px，同時(shí) Sketch Measure 也內(nèi)置了常用的倍率和單位，點(diǎn)擊下拉菜單即可選擇
