[Unity]TextMeshProで日本語表示! | 【ゆにすち! - 入門編】(part.013)

ゆにすち(この画像は、https://www.pakutaso.com/さまから借用しています)

こんにちわ、横浜すみっこクリエイターととです。
『UnityでSTEAM販売を目指す!』略して『ゆにすち!』の【入門編】です!
この【入門編】では、3Dゲーム開発プラットフォームである[Unity]の導入と、その基本操作を学習していきます。

今回は、[Unity]のTextMeshPro(以下、「TMP」といいます)で日本語が表示できるようにしていきます!

『ゆにすち!』シリーズ

このシリーズでは『UnityでSTEAM販売を目指す!』略して『ゆにすち!』と銘打ち、プログラムもモデリングも企画も販売も何から何までぜ~んぶド素人のととが、PCゲームを考え、制作して、販売するまでの風景を履歴として残していくものです。短い連載を重ねる形で発信していければと良いな、と思っております。
この【入門編】では、3Dゲーム開発プラットフォームである[Unity]の導入・基本操作を学んでいきます。

この記事のポイント!

  • 日本語が文字化けするのは、日本語表示できるフォントがないから!
  • フォントファイルをアセットに追加する!
  • 使用フォントはライセンスに注意!
  • フォントファイルからフォントアセットを生成する!
  • TMPとフォントアセットを紐づければ日本語が表示できるようになる!

TextMeshProで日本語表示に対応!

そのままだと文字化け

ゆにすち(日本語が文字化けしています)

前回の記事で、上図のようにTMPの日本語部分が□(四角)に文字化けしてしまっていました。
今回は、文字化け原因を解消してちゃんと日本語が表示できるようにしていきます。
サンプルで使用するフォントは「NotoSansJP - Regular」です。

フォントファイルをアセットへ

文字化けの原因は、デフォルトで日本語表示できるフォントファイルが[Unity]内にないからです。

ゆにすち(フォントファイルをアセットに入れます)

ということで、フォントファイルを《プロジェクトウィンドウ》のアセットの中にドラッグ&ドロップで入れてあげます。

ゆにすち(フォントファイルが入りました)

フォントファイルがアセット内に入りました。

このとき、注意すべきがフォントのライセンスです。[Unity]で作ったゲームでは、フォントファイルが組み込まれて配布されることになるので、フォントファイルを再配布することと同義になります。フォントライセンス下で、再配布が認められていないものを[Unity]へ組み込んでしまうとライセンス違反となりますので、くれぐれもご注意ください。
今回使用している「NotoSansJP - Regular」はオープンフォントライセンス(OFL)でライセンスされているフォントで、再配布可能なものになります。
テクスチャにしてしまって、フォントファイル自体は組み込まない方法もあるようです。

フォントアセットの生成

ゆにすち(フォントアセットを生成します)

アセット内のフォントファイルを右クリックして、コンテキストメニューから作成 > TextPeshProt > Font Assetをクリックします。

ゆにすち(フォントアセットができました)

フォントアセットができました。

フォントの移動

ゆにすち(TMP Settingsを選択します)

フォントファイルとフォントアセットは、しかるべき場所に入れておく必要があります。
《プロジェクトウィンドウ》のツリーから、「Assets > TextMeshPro > Resources」をたどって、その中にある「TMP Settings」をクリックします。

ゆにすち(パスを確認します)

《インスペクターウィンドウ》に「Default Font Asset」が表示されるので、「Path」を確認します。
(上図の場合は、「Resources/Fonts & Materials/」です)

ゆにすち(フォントアセットを移動させます)

フォントファイルとフォントアセットを、「Assets」直下から確認したパスに移動させる。

TMPと作成したフォントアセットを紐づける

ゆにすち(TMPとフォントアセットを紐づけます)

《ヒエラルキーウィンドウ》または《シーンビュー》から前回作成したTMPを選択状態にします。
《インスペクターウィンドウ》の「TextMeshPro - Text (UI)」コンポーネント内の「Main Settings」の「Font Asset」から目的のフォントアセット(今回は、「NotoSansJP - Regular」)をクリックします。

《シーンビュー》の確認

ゆにすち(日本語が表示されました!)

設定を終えて《シーンビュー》を見てみると、無事日本語が表示されるようになっていることがわかります。
改行がうまくできていませんが、「TextMeshPro - Text (UI)」コンポーネント内の「Main Settings」の「Wrapping」の設定を変更することで、枠からはみ出して表示することができるようになります。

まとめ

今回は、[Unity]でデフォルトのままでは日本語表示に対応していない「TextMeshPro」で日本語表示できるようにしてみました。表現の幅が広がりましたね。

次回予告

[Unity]TextMeshProを動的に変更!
次回は、[Unity]のTMPをスクリプトから変更できるようになりましょう!
では、今回はこの辺で。

コメント

このブログの人気の投稿

[Unity]TextMeshProを動的に変更! | 【ゆにすち! - 入門編】(part.014)

UnityでSTEAM販売を目指す!