日本以外は英語で日本は日本語で表示するWindowsストアアプリの作り方まとめ

  • Article

ワールドワイド向けにストアアプリを公開したい場合、英語でUIを構成すれば十分です。しかし、日本向けには日本語で表示されるアプリにしたい…そんな方は多いと思います。多国語化対応に関する記事や解説は多く出ていて、ネット上で探せば対応できるのですが、いちいち探すのは面倒なので、この投稿で、ハブアプリプロジェクトテンプレートをベースに開発する場合について、英語と日本語を適切に切り替える方法をまとめて解説しておきます。

やりたいことは、

OSのロケールがja-jpの時→アプリ実行時の全てのテキスト表示を日本語化し、アプリ名表示も日本語表示

OSのロケールがja-jp以外の時→アプリ実行時の全てのテキスト表示を英語化し、アプリ名表示も英語表示

です。ハブアプリテンプレート作成時、プロジェクトの構成は、

こんな感じです。先ずは、日本語で全てアプリを開発してしまいましょう。DataModelフォルダーのSampleData.jsonに日本語を記載する場合は、保存オプションの詳細設定で、”Unicode（UTF-8 シグネチャ付き - コードページ 650001”を指定して保存しなおしてください。

一通りこれを英語化していきます。

その１）SampleData.jsonの二カ国語化

このファイルに記載されている内容はアプリのグループやアイテムの情報として表示されるわけです。これが日本語だったり英語だったりすれば切り替わらないですね。このファイルの中に日本語英語を両方詰め込むやり方も考えられるのですが、インテリセンスも効かないし、間違えやすいので、ダブルファイルによる解決を採用します
このプロジェクトをファイルエクスプローラーで開いて、DataModelフォルダーのSampleData.jsonをSampleData-jp.jsonという名前でコピーします。コピーしたファイルを、ソリューションエクスプローラー上で、DataModelフォルダーを右クリック→追加→既存の項目を選択し、プロジェクトに追加します。このファイルのプロパティのビルドアクションを”コンテンツ”に変更することを忘れずに。で、元のSampleData.jsonの記述を英語化します。
DataModelフォルダーのSampleDataModel.csのSampleData.jsonを読み込んでいるコード（SampleDataSourceのGetSampleDataAsyncメソッド）を、以下の様に修正します。

            string fileName = "SampleData.json";
            if (Windows.Globalization.ApplicationLanguages.Languages.Count>0)
            {
                if (Windows.Globalization.ApplicationLanguages.Languages[0] == "ja")
                {
                    fileName = "SampleData-jp.json";
                }
            }
            Uri dataUri = new Uri("ms-appx:///DataModel/" + fileName);
            StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(dataUri);
            string jsonText = await FileIO.ReadTextAsync(file, Windows.Storage.Streams.UnicodeEncoding.Utf8);
            JsonObject jsonObject = JsonObject.Parse(jsonText);

 これで、OSのロケールに合わせて日本語の場合には、SampleData-jp.jsonを、日本語以外の場合には、SampleData.jsonを読み込むことになります。

その２）UI固定部分の表示の二カ国語化

Hub.xamlを見てください。66行目当たりに、

            <HubSection Width="500" x:Uid="Section1Header" Header="Section 1">

というような記述があります。x:Uidの部分に注目してください。ここではSection1Headerという値が用意されています。この意味は、ソリューションフォルダーのStringsフォルダーの下のフォルダー名とOSのロケール名が一致した場合は、そのフォルダー直下のResources.reswに定義された文字列、Section1Header.Header （x:Uidで指定されているのが、SectionのHeaderプロパティなのでこのような書き方になっている。TextBlockのTextであれば、XXXX.Textなどと書く）で表示される、です。x:Uidを属性として持つ各UIの要素の文字列を全て英語化すれば済むのですが、文字列定義は一か所に集まっていた方が管理が楽だろうということで、以下の様な手順で二カ国語化します。

ソリューションエクスプローラーで、Stringsフォルダーを右クリック→追加→新しいフォルダーを選択し、"en-US"というフォルダーを作成

Stringsフォルダーをファイルエクスプローラーで開き、ja-JPフォルダーの下のResources.reswをen-USフォルダーにコピーする。

ソリューションエクスプローラーで、Stringsフォルダーの下のen-USフォルダーを右クリック→追加→既存の項目を選択し、en-USフォルダー直下のResources.reswを追加。

新しく追加したen-USフォルダー直下のResources.reswの各項目を英語に修正。

その３）

まだまだ修正は必要です。例えば、MessageDialogを開くときのメッセージやタイトルなどは意識して変えないと、日本語と英語の切り替えができません。これは、その２）で追加したResources.reswを使って切り替えます。

           var resourceLoader = new Windows.ApplicationModel.Resources.ResourceLoader();
           var message = resourceLoader.GetString("MessageContent");
           var dialog = new MessageDialog(message);

例えば、こんな感じでMessageDialogに表示するmessageの文字列をResourceLoaderから取得すれば、OSのロケールにあったResources.reswから文字列を取り出すことができます。全てのResources.reswにMessageContentという名前と言語に合わせた文字列を追加しておいてください。

これでアプリ実行時のUI表示の二カ国語化はOK。

その4）

次に、英語表示がデフォルトになるように、Package.appxmanifestを修正します。アプリケーションタブの”既定の言語”、ja-JPをen-USに変更しましょう。これで、デフォルト英語、OSのロケールが日本語の時だけ日本語表示されます。

その５）

このままだと、ストアでのアプリ名表示が、英語、もしくは、日本語のどちらかだけになってしまいます。ここまで対応して完璧
それぞれのResources.reswにAppNameという名前とそれぞれの言語に合わせたアプリ名を定義してください。最後に、Package.appxmanifestのアプリケーションタブの”アプリケーション名”の項目を、”ms-resource:AppName”に変えます。

はい、これで完璧です。他の言語もサポートしたい場合には、同じ方法で、入れ込めばOK。

皆さんお試しを。