Create a Localized String in SwiftUI

Written by Team Kodeco

Reaching a global audience requires apps to be accessible in various languages. In order to achieve this, SwiftUI provides a powerful tool called localized strings. These are special strings that can be easily translated into different languages, allowing your SwiftUI app to adapt and display content in the user’s preferred language. In this chapter, you’ll explore the step-by-step process of implementing localized strings in your SwiftUI app, ensuring that it can be enjoyed by users around the world.

To start with localization in SwiftUI, you will first need to provide a Localizable.strings file in your project. This file contains key-value pairs where the key identifies a string and its corresponding value represents the translated version.

Here’s how you can create a localized string in SwiftUI:

In your Xcode project, create a new Localizable.strings file. You can do this by navigating to File ▸ New ▸ File. Then select Strings File under Resource and click Create, keeping the suggested name of Localizable.strings.

When you select Localizable.strings in the project navigator, you’ll see a Localize button in the File Inspector.

Click Localize, and the base localization will be created, which is set by default to your app’s default development language. This example shows this as English.

Now, it’s time to add a new language:

1. Select your project in the project editor.
2. Choose the Info tab.
3. Click the + button under Localizations, then select your desired language. For this example, let’s choose French.

As soon as you add an additional localization beyond the base language, Localizable.strings becomes a group containing one file for each localization.

Next, you’ll need to provide translated versions of your strings in both English and French files in a key-value format. Let’s add an English and a French translation for the string identified by "hello_world".

In Localizable.strings (English), add the following:

"hello_world" = "Hello, World!";

In Localizable.strings (French), add:

"hello_world" = "Bonjour tout le monde";

Finally, in your SwiftUI view file, use the LocalizedStringKey within the Text view initializer as follows:

struct ContentView: View {
  var body: some View {
    Text("hello_world")
  }
}

In this code, "hello_world" is the key used to identify the string that needs to be localized. Text will use its initializer that requires a LocalizedStringKey and will fetch the localized version of the string based on the user’s current language setting.

To test your newly localized app, click the current scheme in the project window toolbar, then choose Edit Scheme ▸ Run ▸ Options and change the App Language to French. Xcode should look like this:

Run your app. The text will now display as “Bonjour tout le monde” instead of “Hello, World!”. Your simulator should look like this:

Congratulations, you’ve created a localized app! By properly following these steps, you can effectively create localized strings in SwiftUI, allowing your app to support multiple languages, and thus widening your app’s accessibility to a global audience.