国や言語に合わせて画像オブジェクトの画像を切り換える

Siden oppdatert :
ページ作成日 :

現在表示しているページは選択中の表示言語には対応しておりません。

検証環境

Windows
  • Windows 11
Unity エディター
  • 2021.3.12f1
Input System (Unity Technologies)
  • 1.4.3
Localization (Unity Technologies)
  • 1.3.2

この Tips の前提設定

この Tips の説明の前提として以下の設定を事前に行っています。

前提知識

この Tips の内容の半分ぐらいは以下の前回の Tips と同じですので、重複する部分については簡単な手順のみ掲載します。 詳しく手順を知りたい場合は以下の Tips を参照してください。

素材の用意

今回画像の切り替えを行いますので画像ファイルを用意します。 今回の Tips ではロケールとして「Japanese (ja)」「English (en)」「Spanish (es)」の3つを使いますのでそれらに関係のある国旗画像をサンプルとして使用します。

Japanese (ja) English (en) Spanish (es)

これらは Scenes フォルダに入れておきます。

素材元

Localization パッケージのインストール

Localization パッケージをインストールしていない場合はインストールしてください。この手順は前回と同様です。

Localization の作成

ここも前回と同じなので画像だけ載せておきます。

ここでは「Scenes」のフォルダの中に「Localization」のフォルダを作成してその中に作成しています。

ロケールの作成

ここも前回と同じなので細かい手順は割愛します。 追加するロケールは「Japanese (ja)」「English (en)」「Spanish (es)」です。

先ほどの「Localization」フォルダを指定しています。

デフォルトのロケールは「Japanese (ja)」にしておきます。

画像の登録

ここからは画像の設定となります。各ロケールに合わせた画像を登録していくことになります。 方法はいくつかあるのですが、ここではゲームオブジェクトが何もないところから設定していく方法で作成します。

メニューから「ウィンドウ -> アセット管理 -> Localization Tables」を選択します。

「New Table Collection」をクリックします。

作成したロケール全てにチェックがついていることを確認します。

今回は画像のローカライズなので「Type」は「Asset Table Collection」を選択します。テキスト以外は基本的にこれを選択することになります。 各ロケールごとの値はテーブル形式の一覧として保持されるのでテーブル名を指定します。ここでは ImageTable としています。

入力したら「Create」ボタンをクリックします。

保存先を選択します。 テーブルごとに複数のファイルが生成されるので専用のフォルダを作成したほうが好ましいです。 ここでは「Localization」フォルダの中に「ImageTable」フォルダを作成してそこを指定しています。

作成するとテーブルが表示されます。まだ何も作成していないので0行です。

フォルダの方もロケールの数だけファイルが作成されます。こちらを直接触ることは基本的にないです。

ではレコードをひとつ作成してみます。テーブルに「Add New Entry」ボタンがあるのでクリックします。

すると1行追加され、各ロケールごとに入力欄が表示されます。 各ロケールに各国旗を設定してください。プロジェクトから画像をドロップしたほうが簡単だと思います。 キーは NationalFlag としておきます。

テーブル形式なので複数登録することができますが今回は一つだけにしておきます。 入力したらダイアログは閉じてください。どこかにドッキングさせてもいいです。

画像オブジェクトへのローカライズ設定

今回は UI の画像オブジェクトに対して、ゲームに設定されているロケールに応じて表示画像が切り替わるようにしてみます。

まずは Raw 画像オブジェクトを配置してください。他の画像を扱うオブジェクトでも可能ですが少し追加の手順が必要になります。Raw 画像なら簡単に設定可能です。

画像によってオブジェクトのサイズが変わることはないので、少なくとも縦横比は同じになるようにあらかじめセットする必要があります。

Raw Image コンポーネントの三点リーダーメニューから「Localize」を選択します。

すると新たに「Localize Texture Event」コンポーネントが追加されます。 Localize Asset Reference が未選択なので None (Texture) の箇所をクリックします。

ダイアログが表示されるので、上の入力欄にセットする Localization のアセットのキーを入力します。 ここでは NationalFlag と入力して下の一覧から NationalFlag をダブルクリックします。

Localize Asset Reference を展開すると各種値が設定されていることを確認できます。設定はこれだけです。

実行して確認

設定が終わったらゲームを実行してみてください。 ゲームを実行すると画像が変化するはずです。 下図では日本語の環境で実行しているので日本語で表示されます。

エディタ上のゲーム画面の右上にはロケール切り替えが表示されているのでそこでゲームのロケールを変更することができます。 ためしに Spanish を選択してみます。

すると画像の内容が自動で切り替わることを確認できると思います。

このように Unity 公式の Localizetion パッケージでは UI への適用と切り替えの動作確認が簡単にできるようになっています。

他の言語の環境で実行してみる

プログラムをビルドして出力し、他の言語の環境で実行したときに対応する言語で表示されるか確認してみます。

以下の図は Windows 11 の日本語 OS に対して追加で英語をインストールし、デフォルトの言語を英語にした環境で実行した結果です。 きちんと環境に応じて画像が切り替わっていることを確認できると思います。