摘抄自知乎-五道口大鯊魚
UI 設(shè)計(jì)師用 sketch 輸出的設(shè)計(jì)稿交付工程師后還原總是會(huì)遇到一些問題
尤其以字體與其它元素的間距最容易出問題规个，主要的原因是 sketch 與 ios 系統(tǒng)中字體的行高不同固翰。最簡(jiǎn)單的解決方法是通過手動(dòng)調(diào)整 sketch 中字體的行高围俘，業(yè)界常用的行高是字體 size 的1.2或者1.4倍，實(shí)際這兩個(gè)值都是夠不準(zhǔn)確的优构。
所以要想知道最準(zhǔn)確的值诵叁，那就要先把程序中字體的行高的值取出來，最簡(jiǎn)單的方法當(dāng)然就是用 xcode 跑幾十種不同尺寸字體钦椭，然后截圖量出來行高對(duì)了拧额。
下圖是新鮮的 xcode 用單個(gè) Label 拖動(dòng)的方式，把不同字號(hào)的中英文字體放到界面中
背景顏色即為程序中字體的行高彪腔，也就是 sketch 中的 spacing line 的值侥锦。
可以看到 mainStoryboard 中的文本已經(jīng)跑到左邊的模擬器里面了，這個(gè)時(shí)候只需要 com+s 即可保存原汁原味的屏幕截圖德挣。
下面這張圖就是程序上面的原截圖恭垦，左邊的橙色區(qū)域是我已經(jīng)測(cè)量好的行高值。
上圖并不容易看清楚不同字體不同的行高格嗅，所以我也制作了一個(gè)表格
具體整理出來的表格在下方
綠色區(qū)域?yàn)槲覀冊(cè)?APP 開發(fā)中常用的字號(hào)22px ~30px
最下方的+4 +6 +8..... 都是總結(jié)出來的規(guī)律：
如果字體大小在12~20之間番挺，字體行高等于字體大小加4；
if ( 12 <= font size <= 20 ) { line height = font size + 4 };
if ( 22 <= font size <= 30 ) { line height = font size + 6 };
if ( 32 <= font size <= 40 ) { line height = font size + 8 };
.......
實(shí)際上上面的 if 語(yǔ)句還是有規(guī)律的屯掖，所以插件里用到了更好的算法玄柏，程序方面的東西就不在這里細(xì)寫了。
計(jì)算機(jī)上所有重復(fù)的工作都是可以通過程序去解決贴铜，所以我們制作了一個(gè)sketch插件
youngxkk/AutoFixiOSTextLineHeight?github.com
插件運(yùn)行原理是遍歷 sketch 中字體的大小粪摘，然后通過上方表格的規(guī)律，把不同尺寸的字體填充不同的行高绍坝，達(dá)到與 ios 開發(fā)中字體的行高相同徘意。
這樣用 sketch measure 導(dǎo)出的設(shè)計(jì)稿給工程師的時(shí)候，只要工程師按照設(shè)計(jì)稿上面字體與其它元素間距的值去寫程序陷嘴，那么還原度理論上是100%的。
【只測(cè)試過 iOS 系統(tǒng)中蘋方和 SF 字體间坐，其它的自定義字體就隨緣吧灾挨∫赝耍】
【建議多行文本不要使用此插件】會(huì)讓排版變的很丑陋，多行文本就單獨(dú)與開發(fā)聯(lián)調(diào)吧劳澄。
目前支持同時(shí)選中多個(gè)文本圖層或選中單個(gè) Artboard地技，然后運(yùn)行插件
使用快捷鍵效率更高：shift + option + command + i
【GIF】
