0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

SwiftUIのアプリをString Catalogで多言語対応させる方法

0
Last updated at Posted at 2026-05-27

SwiftUIで作成したアプリを多言語対応(ローカライズ)させる方法について新たな学びがあったので、備忘録も兼ねて紹介したいと思います。
(おそらく他にもいろいろあると思いますが、、、)

対象者

  • Swift初心者〜中級者
    (プロジェクトの作成からビルド、シミュレーターや実機での実行ができる前提で説明しています。)

使用環境

  • macOS Tahoe 26.4.1 (25E253)
  • Xcode 26.5 (17F42)

そもそもどうやる?

一言で言うと、コード内で一意のKeyを用意して実装後、端末の言語設定に応じてKeyに対応する文字列を代入するように表示すると言うことです!
...。
おそらく下記の方法でやっていただけるとできるかと思います。

方法には2種類

アプリを多言語対応させる方法は(自分が知っている限りでは)2つあります。

  • String Catalogを使う方法
  • Strings File(Legacy)を使う方法

おすすめはString Catalogです!
過去自分はStrings File(Legacy)を使っていましたが、圧倒的にStrings Catalogを使った方が楽に構成できます。
よって、今回はStrings Catalogを使う方法をご紹介します。

Strings Catalogを使う方法

ここではプロジェクトを新規作成したときにデフォルトで記載されるプログラムを例にします。
Screenshot 2026-05-27 at 9.46.21.png

  1. まず、左下の「+」をクリックして、「New File from Template...」をクリックします。
    Screenshot 2026-05-27 at 9.47.20.png

  2. 開いたウィンドウ内でから「String Catalog」を探して、クリックします。 (下にスクロールすると出てきます。)
    Screenshot 2026-05-27 at 9.49.20.png

  3. ファイル名が「Localizable.xcstrings」となっており、プロジェクトのディレクトリ(フォルダ)が選択されていることをあることを確認して、「Create」をクリックします。(なお、セキュリティ上の問題から画像の一部を加工しています。)
    Screenshot 2026-05-27 at 9.54.46.png

  4. 下記のようなファイルができたらOKです。
    Screenshot 2026-05-27 at 9.59.00.png

  5. 次に、コードの中で多言語対応させたい部分をKeyに置き換えます。 keyは自由に決めてOKですが、重複しなさそうで、後から何を意味しているのかわかるようなKeyにすることをお勧めします。(例ではメイン画面の挨拶なので、「mainView.greeting」としました。)

(2026/05/31 追記)
基本的には直接Keyを記入すると反映されるのですが、時々Keyがそのまま表示されてしまうみたいです。特に、関数の引数として渡す場合などは、LocalizedStringKeyとして正常に解釈されない場合があります。
下記のようにString()とlocalized:を使うと、安定的に表示させることができます。

Text(String(localized:"mainView.greeting"))
import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            Image(systemName: "globe")
                .imageScale(.large)
                .foregroundStyle(.tint)
            Text("mainView.greeting")      //←ここを「Text("Hello, World!")」から変更した
        }
        .padding()
    }
}

#Preview {
    ContentView()
}

Screenshot 2026-05-27 at 10.04.46.png
6. ただし、上の画像のプレビューから分かるように、このままだとKeyが直接UIに表示されてしまいます。そこで先ほど作成した「Localizable.xcstrings」の出番です。左上の「+」ボタンを押します。追加されたkeyの部分に先ほどコードで記述したKeyを入力し、「English(en)」に英語設定の時に表示したい文字列を入力します。
Screenshot 2026-05-27 at 10.06.52.png

項目 例での記載内容
Key 設定した文字列 mainView.greeting
English(en) 表示したい文字列 Hello, World!

Screenshot 2026-05-27 at 10.10.47.png
7. 左下の「+」を教えて別の言語を追加します。ここでは「Japanese(ja)」を選択しました。
Screenshot 2026-05-27 at 10.17.20.png
Screenshot 2026-05-27 at 10.18.46.png
Screenshot 2026-05-27 at 10.19.01.png
8. すると新たに「Japanese(ja)」という項目が増えるので、そこに日本語設定の時に表示したい文字を入力します。(その他のKeyなどはすでに入力されているはずです。)
Screenshot 2026-05-27 at 10.20.33.png
9. この時点で日本語に対応できました。シミュレーターで実行し、言語設定を変えるとちゃんとその言語で表示されます!
英語設定の時:
Screenshot 2026-05-27 at 10.23.31.png
日本語設定の時:
Screenshot 2026-05-27 at 10.24.13.png

他に、コード内で多言語対応させたい場所があれば、新たにKeyを追加して記述すればOKです!

まとめ

意外と簡単に多言語対応できます!(すでに作成しているプロジェクトを切り替える際は全てのTextなどをKeyに置き換える必要があるので面倒ですが,,,)
ぜひ皆さんもやってみてください!

(間違っている箇所があればコメントで教えていただけますと幸いです。)

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?