《從0到1上線微信小遊戲》第五節 使用BMFont軟件製作位圖字體

第五節 使用BMFont軟件製作位圖字體

下載BMFont

確定字符

字體添加和導出設置

導入字符

導出位圖字體

使用位圖字體


好看的字體可以增加遊戲的美觀度或者趣味性,本節筆者就來帶教大家如何使用BMFont來製作字體並添加到遊戲中。

注:由於BMFont只有exe格式,所以本節筆者將在Windows系統上進行演示。

 

下載BMFont

大家可以點擊這個BMFont官網鏈接去下載該軟件。

網站一共提供了兩種下載版本:安裝版和免安裝版。

筆者建議就直接下載免安裝版的,方便又快捷,而且版本較新,相對於安裝版本(1.13)也修復了很多bug。

下載完畢後雙擊運行就可以了:

 

確定字符

新建一個txt文件(名稱隨意),輸入你要修改(字體)的字符。按照我們前幾節的遊戲開發情況來看,需要用到的字符就是下面這些:

不過我們也可以稍微多加一些以防後續開發會用到,這樣可以少一次重新做位圖字體的麻煩:

 

確定好字符後,請點擊保存->另存爲,確保自己將文本編碼方式設置爲UTF-8

注:爲防止以後要添加新的字符,請不要刪除這個txt文件。

 

字體添加和導出設置

點擊Options->Font settings打開字體設置窗口。點擊Font下拉框選擇已經在系統中安裝好的字體:

注:通常要製作位圖字體的話,我們會使用付費的或者已經獲取版權的字體。如果是系統自帶的字體,我們其實不需要製作,直接在Cocos引擎中進行選擇就可以了。那筆者這裏爲了演示,就直接在BMFont中用系統自帶的字體了。

點擊OK後,我們再通過Options->Export options打開導出設置窗口並進行如下設置:

  1. 由於我們的字符數量不是特別多,所以可以讓最後生成的字體圖片小一些。如果字符數很多,而這裏的圖片大小又設置的很小的話,那BMFont爲了把所有字符都包含進去,就會生成很多張同等大小的圖片。
  2. 位數我們選擇32位。
  3. 最後的格式選擇png,也就是將字體放在圖片上。

點擊OK保存。

 

導入字符

點擊Edit->Select chars from file,選擇我們剛纔保存好的txt文件導入字符。此時出現在txt文件中的字符就會在窗口中發亮顯示:

 

導出位圖字體

點擊Options->Save bitmap font as導出位圖字體:

一共生成兩個文件,分別是fnt格式和png格式。

接着我們打開Tetris.fnt文件查看下里面size的值:

如果這個是負數,那麼我們在使用該位圖字體時,所有的字體將會倒着顯示。所以爲了正常顯示,我們需要把這個負號給去掉:

 

使用位圖字體

接下來我們就在Cocos Creator中使用剛製作好的位圖字體。

首先在資源管理器中添加位圖字體:

接着將上面圖標爲Bf的文件拖入score節點上的Label組件中就行了:

 

運行截圖如下:

 

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章