Quickstart: Translating UI resources (XAML)

  • Article

[ This article is for Windows 8.x and Windows Phone 8.x developers writing Windows Runtime apps. If you’re developing for Windows 10, see the latest documentation ]

Put string resources for your UI into resource files. You can then reference those strings from your code or markup.

Instructions

  1. Put strings into resource files, instead of putting them directly in code or markup.

    1. Open package.appxmanifest in Visual Studio, go to the Application tab, and set your default Language to "en-US". If this is a universal app, do this for each package.appxmanifest in your solution. Note  This specifies the default language for the project. The default language resources are used if the user's preferred language or display languages do not match the language resources provided in the application.  
    2. Create a folder to contain the resource files.
      1. In the Solution Explorer, right-click the project (the Shared project if this is a universal app) and select Add > New Folder.
      2. Name the new folder "Strings".
    3. Create a sub-folder and a resource file for English (United States).

      1. Right-click the strings folder and add a new folder beneath it. Name it "en-US". The resource file is placed in a folder that has been named for the BCP-47 language tag. See How to name resources using qualifiers for details on the language qualifier and a list of common language tags.

      2. Right-click the en-US folder and select Add > New Item….

      3. Select "Resources File (.resw)".

      4. Click Add. This adds a resource file with the default name "Resources.resw". We recommend that you use this default filename. Apps can partition their resources into other files, but you must be careful to refer to them correctly (see How to load string resources).

      5. If you have .resx files with only string resources from previous .NET projects, select Add > Existing Item…, add the .resx file, and rename it to .resw.

      6. Open the file and use the editor to add two new resources:

        Strings/en-US/Resources.resw

        In this example, "Greeting.Text" and "Farewell" identify the strings that are to be displayed. "Greeting.Width" identifies the Width property of the "Greeting" string. The comments are a good place to provide any special instructions to translators who localize the strings to other languages.

  2. Associate controls to resources.

    You need to associate every control that needs localized text with the .resw file. You do this using the x:Uid attribute on your XAML elements like this:

    <TextBlock x:Uid="Greeting" Text="" />

    For the resource name, you give the Uid attribute value, plus you specify what property is to get the translated string (in this case the Text property). You can specify other properties/values for different languages such as Greeting.Width, but be careful with such layout-related properties. You should strive to allow the controls to lay out dynamically based on the device's screen.

    Note that attached properties are handled differently in resw files such as AutomationPeer.Name. You need to explicitly write out the namespace like this:

    MediumButton.[using:Windows.UI.Xaml.Automation]AutomationProperties.Name

  3. Add string resource identifiers to code and markup.

    In your code, you can dynamically reference strings:

    var loader = new Windows.ApplicationModel.Resources.ResourceLoader();
var str = loader.GetString("Farewell");

    auto loader = ref new Windows::ApplicationModel::Resources::ResourceLoader();
auto str = loader->GetString("Farewell");

  4. Add folders and resource files for two other languages.

    1. Add another folder under the strings folder for German. Name the folder "de-DE" for Deutsch (Deutschland).

    2. Create another Resources.resw file in the de-DE folder, and add the following:

      strings/de-DE/Resources.resw

    3. Create one more folder named "fr-FR", for français (France). Create a new Resources.resw file and add the following:

      strings/fr-FR/Resources.resw

  5. Build and run the app.

    Test the app for your default display language.

    1. Press F5 to build and run the app.
    2. Note that the greeting and farewell are displayed in the user's preferred language.
    3. Exit the app.

    Note  Windows Store apps only. Test the app for the other languages.

    1. Open the Control Panel, and select Clock, Language, and Region > Language.
    2. Note that the language that was displayed when you ran the app is the top language listed that is English, German, or French. If your top language is not one of these three, the app falls back to the next one on the list that the app supports.
    3. If you do not have all three of these languages on your machine, add the missing ones by clicking Add a language and adding them to the list.
    4. To test the app with another language, select the language in the list and click Move up until it is at the top. Then run the app.

    Note  Windows Phone Store apps only. Test the app for the other languages.

    1. Bring up Settings on the phone (or phone emulator).
    2. Select language.
    3. Note that the language that was displayed when you ran the app is the top language listed that is English, German, or French. If your top language is not one of these three, the app falls back to the next one on the list that the app supports.
    4. If you do not have all three of these languages on your phone, add the missing ones by tapping add languages and adding them to the list.
    5. To test the app with another language, tap and hold the language in the list and then tap move up until it is at the top. Then reset the phone and run the app.

How to name resources using qualifiers

How to load string resources

Roadmap for Windows Runtime apps using C# or VB

Roadmap for Windows Runtime apps using C++

The BCP-47 language tag