雨哥自己不喜歡用小字體,不過很多朋友都喜歡。之前分享過一篇非常詳細(xì)的小字體制作教程,基本上讀完了就夠了:
雨哥為什么不喜歡小字體?因?yàn)樾∽煮w在顯示過程中總會有Bug,尤其是蘋果手機(jī),總會出現(xiàn)某些地方顯示不全,無解。如下圖所示:
上面一排為字體的標(biāo)準(zhǔn)字距和大小,矯情的蘋果手機(jī)會在很多界面和App記住這個標(biāo)準(zhǔn)字距和大小。下面一排是縮小到80%的字體。大家會發(fā)現(xiàn),跟標(biāo)準(zhǔn)字距完全重合的地方很少,這也是為什么某些App里面小字體會缺少半個字顯示。
??????教程前沿??????
如果你會打包TTF字體文件,那么可以繼續(xù)往下看,不會的話這里有教程:字體屬性修改、TTC打包①、TTC打包②。
拿我免費(fèi)分享的已經(jīng)優(yōu)化過字庫的字體直接縮小會比較簡單。如果是其他字符不全的字體需要補(bǔ)字庫的話,這里也有詳細(xì)的教程《從零開始教你補(bǔ)字庫》,熟悉之后可以繼續(xù)往下看。
??????不一樣的字體縮小教程??????
早期的教程里面,我們是通過FontCreator菜單里面的Tools - Glyph Transformer,在變形工具的Outlines - Scale里面選擇參數(shù)進(jìn)行縮小:
今天推薦另外一個工具:Fontlab(百度搜索獲取)。
Fontlab工具能做的事情,基本上FontCreator都可以更好的做到,但是有一點(diǎn)FontCreator不可以,那就是Fontlab可以全局修改字體的UPM值,關(guān)于UPM值的介紹,雨哥在之前的一篇教程里面有:
今天以蘋方字體縮小80%為例,我們用Fontlab打開TTF文件,然后電腦快捷鍵Ctrl+Alt+F,出現(xiàn)下面的工具,鼠標(biāo)定位到Metrics and Dimensions:
看一下原來的值,蘋果標(biāo)準(zhǔn)是1000,我們把這個1000改成800,然后一定要記得勾選下面的Scale前面的框框:
操作完畢后點(diǎn)擊最下面的OK。OK之后,再按電腦快捷鍵Ctrl+Alt+G,保存一個新的TTF文件。
我們用電腦打開這個新的TTF文件,發(fā)現(xiàn)跟之前的文件字體大小一模一樣,沒有任何區(qū)別,不著急,還有下一步。
再用FontCreator打開這個修改過的TTF文件,然后點(diǎn)擊菜單Font - Propreties - General,這里顯示的Units per em變成800了,把這個800改成1000,然后點(diǎn)下面的OK:
然后再看,字體是不是明顯縮小了?完事了嗎?還沒有,這時候我們會發(fā)現(xiàn)字體往下偏移了很多,字體位置發(fā)生了很大的變化。我們需要把所有字符通過變形向上位移72個像素:
這樣操作之后,再導(dǎo)出TTF,這個TTF文件就完美縮小了80%了,而且位置也正確了。
那么為什么是往上移動72個像素呢?我算出來的。如果是縮小到70%,那么最后修復(fù)位置需要上移108。意思就是:每縮小1個百分點(diǎn),最后修復(fù)位置需要上移3.6個像素。如果是縮小到90%,那么就是上移3.6×10=36,前提條件是最開始的UPM值是1000。記得點(diǎn)在看??哦
??????需要修改哪些文件呢??????
安卓不說了,縮小TTF文件原理是相同的,蘋果需要修改下面這140多個文件,第一章截圖是英文,第二章截圖是中文,以iOS12為例:
??????小字體總結(jié)??????
??????小字體分享??????
今天說的這種縮小字體的辦法,相對于之前的教程,雨哥覺得可能更加合理,找?guī)讉€朋友測試了一下,有一些雖然百年難得一見的小Bug可以規(guī)避掉。但是缺點(diǎn)也很明顯:整個操作過程復(fù)雜了很多,增加了難度和時間。
今天用這個教程,做了一套蘋方大陸字形85%的小字體,找?guī)讉€朋友測試了一下,跟用第一個教程在視覺上沒區(qū)別,但是在一些所有小字體都有Bug的地方,這種做法竟然Bug少很多。