今回は作ったゲームをWebアプリケーションとして公開したかったのですが、途中うまくいかなかった部分についてまとめてみました。
現象
Unity上でゲームをプレイすると日本語のテキストが表示されるのにWebGLでビルドして起動してみると、Webブラウザから遊んでみると日本語の部分が抜け落ちてしまう。
Unity上でゲームをプレイした時の画面
Unity上でゲームをプレイすると「猫の冒険」というタイトルが表示され、「続きから/はじめから/おしまい」というボタンが表示されている。
WebGLでビルドしてWebから参照した画面
WebGLでビルドしたものを起動させ、Webブラウザから参照すると、タイトルと各種ボタンの日本語が抜け落ちてしまう。
原因
Unityのフォントの初期設定が[Arial]というもので、日本語が含まれていないためのようでした。ただUnityエディタ上ではフォントフォールバック機能が働き、日本語が表示されていたようですが、WebGL上ではこの機能が働いていないため日本語部分が抜け落ちていたようです。
解決策
UnityのTextコンポーネントで使用するフォントを日本語を含むものに指定すると、WebGLでビルドしても日本語が表示されるようです。
フォント取得
日本語を表示させるには、日本語が含まれるフォントを指定することで回避できそうです。
利用するフォントは[PixelMplus12-Regular]というフリーフォントを以下のサイトから取得します。
itouhiro.hatenablog.com
Unityのプロジェクトに登録
フォントファイルを Unity にアセットとして追加します。今回は「PixelMplus12-Regular.ttf」を使ってみます。ファイルをAssetsフォルダにドラッグ&ドロップで追加します。
フォント指定
Textコンポーネントの「Font」に先ほど追加したフォントを指定します。
「Character」->「Font」に先ほど追加した「PixelMplus12-Regular.ttf」というフォントを指定します。
表示確認
Unity上で文字の表示を確認し、WebGLで再度ビルドしてWebブラウザから表示内容を確認してみます。
