コガネブログ

平日更新を目標にUnityやC#、Visual Studioなどのゲーム開発アレコレを書いていきます

【Unity】uGUI のテキストでビットマップフォントを使用する方法

はじめに

上記のサイト様でも詳しく紹介されていますが、
この記事でも uGUI のテキストでビットマップフォントを使用する方法を
書き残しておこうと思います

目次

素材の準備

f:id:baba_s:20180319212523p:plain

あらかじめビットマップフォントにしたい文字画像を用意しておきます

Adobe AIR のインストール

  1. 下記のサイトにアクセスして「今すぐダウンロード」ボタンを押します
    https://get.adobe.com/jp/air/
  2. ダウンロードした「AdobeAIRInstaller.exe」を実行して
    Adobe AIR をインストールします

ShoeBox のインストール

  1. 下記のサイトにアクセスして、画面右上の「ShoeBox 3.6.5」ボタンを押します
    http://renderhjs.net/shoebox/
  2. ダウンロードした「ShoeBox_3.6.5_public.air」を実行して
    ShoeBox をインストールします

ビットマップフォントを作成する

f:id:baba_s:20180319212745p:plain

インストールした ShoeBox を起動して「GUI」タブを選択します

f:id:baba_s:20180319212833p:plain

ビットマップフォントにしたい文字画像を「Bitmap Font」の欄にドラッグします

f:id:baba_s:20180319213058p:plain

「Save Font」ボタンを押します

f:id:baba_s:20180319213214p:plain

これで、文字画像が存在するフォルダに下記の2つのファイルが出力されます

  • XXXX-export.xml
  • XXXX-export.png

ShoeBox Tools for Unity の導入

 
Asset Store から「ShoeBox Tools for Unity」をダウンロードして
Unity プロジェクトにインポートします

f:id:baba_s:20180319213702p:plain

Unity でビットマップフォントを使用する

f:id:baba_s:20180319213826p:plain

Unity メニューの「Assets>ShoeBox Tools>Import Bitmap Font」を選択して
先ほど ShoeBox で出力した XML ファイルを選択します

f:id:baba_s:20180319213948p:plain

すると、ビットマップフォントのアセットが生成されます

f:id:baba_s:20180319214106p:plain

そして、生成したビットマップフォントのデータを
uGUI のテキストの「Font」の項目にドラッグして設定することで

f:id:baba_s:20180319214235p:plain

ビットマップフォントを使用して文字を描画できます

関連記事