制作字體的兩個(gè)方法

app對(duì)字體顯示有特殊要求時(shí),開發(fā)會(huì)在安裝包里放入字體文件。最近就遇到需要加入特殊數(shù)字和部分符號(hào)的字體,以下:

字體的兩種做法,使用Iconfont生成字體和Fontlab Studio制作字體;

1、使用Iconfont生成字體

用到工具:AI、瀏覽器(偶爾Safari會(huì)出現(xiàn)Iconfont無(wú)法下載問題,換Chrome或者其他瀏覽器)


(1)用AI制作自己需要的字體

a.安裝字體,找到需要使用的字體包

b.字體轉(zhuǎn)曲,調(diào)整字體結(jié)構(gòu)(版權(quán)問題、無(wú)版權(quán)直接轉(zhuǎn)曲不調(diào)整)


(2)按照Iconfont規(guī)范繪制圖表

a.打開http://www.iconfont.cn ,選擇 幫助——圖表繪制——下載源文件——查看規(guī)范

b.把之前做好的字體,按照Iconfont規(guī)范調(diào)整成單個(gè)的SVG,命名他們

命名單個(gè)字體

(3)上傳自己的圖表,加入購(gòu)物車下載代碼

a.注冊(cè)Iconfont帳號(hào)

b.點(diǎn)擊導(dǎo)航欄右側(cè),上傳按鈕,拖入制作好的svg到框內(nèi);

右往左第三個(gè) 上傳按鈕




c.等待上傳完成

d.在自己圖庫(kù)中


(4)給開發(fā)哥哥,看代碼的應(yīng)用;

開發(fā)代碼應(yīng)用:http://www.iconfont.cn/help/detail?spm=a313x.7781069.1998910419.14&helptype=code

Android:

官方文檔還是辣么簡(jiǎn)潔!照這個(gè)可能做不出來(lái)~\e ?改成\ue就能使用啦;另外間距控制Android5.0以上用letterSpacing,兼容的話要自定義View來(lái)做間距控制;

iOS:

官方文檔更簡(jiǎn)潔~!能使用~


2、Fontlab Studio 5

現(xiàn)在只用Mac,所以windows系統(tǒng)參考下步驟;

用到工具:AI、Fontlab Studio 5

(1)同上用AI制作自己需要的字體

a.安裝自己需要的字體包

b.字體轉(zhuǎn)曲

b.單獨(dú)1000*1000px的制作,注意字重、字懷、字面、中宮和重心;

d.復(fù)制需要個(gè)數(shù)的背景板,制作字體

(2)打開Fontlab Studio 5,制作字體

a.新建字體庫(kù)

b.選擇要制作的字體,點(diǎn)擊進(jìn)入;選擇進(jìn)入而不是新建是為了讓字體的XX一一對(duì)應(yīng)

c.直接復(fù)制制作好的AI文件

d.調(diào)整字體位置,間距通過線位置調(diào)整

e. 制作完成所有需要字體、命名字體包

f. 將制作好的文件,導(dǎo)出.tff格式


配圖:兩種字體對(duì)比;老版本字體;


最后實(shí)現(xiàn)的App效果!~ 撒花~

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容