The following forum(s) have migrated to Microsoft Q&A (Preview): Developing Universal Windows apps!
Visit Microsoft Q&A (Preview) to post new questions.

Learn More

 locked
Configure multiple languages in UWP Apps RRS feed

  • General discussion

  • Now many developer wants to promote their app to other countries.  So, they need to configure different languages for their apps.
    Here I'm going to introduce the approximate process so that you can easily complete the basic configuration.
    Step One:  Create a Resources File (.resw) and save the string literals.
    Before you start, you need to set the default language. Open the Package.appxmanifest file and set Default language entry (for example, "en-US") under the Application tab.  All the following steps will assume the default language is “en-US".

    Now create a Resources File (.resw)
    1. Under your project node, create a new folder named "Strings".
    2. Under Strings, create a new sub-folder and name it "en-US".
    3. Under en-US, create a new Resources File (.resw) and confirm that it is named "Resources.resw".
    Then we can save the string literals.

    Step Two:  Refer to a string resource identifier from XAML markup, code behind and package manifest
    Use an x:Uid directive to associate a control or other element in your markup with a string resource identifier.
    Like this:

     <TextBlock x:Name="TextBlockElement"
                       x:Uid="HelloLabel"/>
            <!--a display button-->
    <Button  x:Name="ButtonElement"
                    x:Uid="Button"
                    Click="ButtonElement_Click"
                    /> 

    When you need to refer to the string resource from code, try the following:

     //change the first text block
                var resourceLoader = Windows.ApplicationModel.Resources.ResourceLoader.GetForCurrentView();
                this.TextBlockElement.Text = resourceLoader.GetString("ChangeText"); 

    If you need to get a resource that the name contains "." character, replace dots with forward slash ("/") characters in the resource name.

     this.TextBlockElement.Text = resourceLoader.GetString("Button/Content"); 

    When you need to refer to a string resource identifier from your app package manifest, for example app's display name, use the "ms-resource" URI (Uniform Resource Identifier) scheme:

    Notice that in UWP apps you can factoring strings into multiple Resources Files. You can put your UI strings in one Resources file and error messages in another.

    There is a slight difference when you need to refer to this resource file in Xaml or code behind.
     In Xaml:

    <!--another display textblock--> 
    <TextBlock 
    x:Name="TextBlockElementTwo" 
    x:Uid="/DifferentResources/DifferentLabel" />

    In code behind:

      //change the second text block
                var resourceLoaderTwo = Windows.ApplicationModel.Resources.ResourceLoader.GetForCurrentView("DifferentResources");
                this.TextBlockElementTwo.Text = resourceLoaderTwo.GetString("Greeting");

    If in the manifest file:
    Change it into ms-resource:/DifferentResources/AppDisplayName

    Step Three:  Localize the string resources
    After completing the first two steps, now we can try to localize the string resources for different languages.
    The first way is that do it by yourself. This way is a bit cumbersome.
    Under the String folder, create a new sub-folder and name it "fr-FR" for French.


    Copy the Resources.resw file from en-US folder to fr-Fr folder. Open the Resources.resw file in fr-FR folder and translate the values in the Value column.
    Another way is that you could try to use Multilingual App Toolkit.
    This is a tool that could integrate with Visual Studio and provide translation support for UWP apps.
    1.Download a .vsix installer here: Multilingual App Toolkit 4.0 Extension for Visual Studio 2017.
    2.Download the MAT 4.0 standalone Multilingual Editor tool, in the form of an .msi installer here: Multilingual app toolkit 4.0 Editor
    If you use Visual Studio 2017, then download and run both installers, one after the other. If you use Visual Studio 2015 or Visual Studio 2013, then download and run the .msi installer.
    Now enable Multilingual App Toolkit for your project.  Select the desired project in solution, then find the tool menu and select Multilingual App Toolkit > Enable selection.


    After that, you could try to add languages as you want. Just Right-Click the project and click Multilingual App Toolkit > Add translation languages. It will show a window that you could choose the language you want.
    Once you've done that, a new folder is created named the language. Inside that folder, new Resources File(s) (.resw) are created to match the one(s) that contain the default language strings. And a new folder named MultilingualResources is added to the project. Inside that folder, an .xlf file is added for each language. The .xlf files contain a translation unit for each string in each Resources File (.resw) in your project.


    Next, Right-Click the xlf file and click Multilingual App Toolkit > Generate Machine translations.  After the process is finished, you could see that your string resources has already been translated.
    Note: You might meet problems like "The Microsoft Translator provider no longer provides unlimited access to machine translations". If you get such problem, you need to get an authentication key for the translation service that provided by Azure.  Just follow the steps here: Configuring MAT with the Cognitive Services Key

    Step Four:  Test your app
    Now you have completed the basic configuration for different languages and you can made a simple test.
    Change the display language in Settings > Time & Language > Region & language > Languages and re-test your app. Look at strings in your UI and also in the shell.

    Localization Deployment Considerations
    When you install your app that contains localized language data you may find that only the default language is available for the app even though you initially included resources for multiple languages. This occurs because of the way the installation process is optimized to only install language resources that match the current language and culture of the device. This means that if your device is configured for en-us when you install the app only the en-us language resources will be installed. If you change the default language of the Operating System the app will still only display en-us resources because it is the only language installed for the app. At this time there is no way to install additional language support for your app after the initial installation.
     
    If you would like to make sure that all language resources are available after installation you can create a configuration file for the app package that specifies that certain resources are required during installation. In this configuration file you can require any resource be installed including the language resources. For more information on guaranteeing resources are installed please refer to this document:   Ensure that resources are installed on a device regardless of whether a device requires them
     
    This optimized installation feature is automatically enabled when you generate an appxbundle for your app during packaging. Optionally to ensure that all resources are installed you can disable appxbundle generation when you package your app. This is not recommended however because it may increase the installation time of your app considerably. It is recommended that you create a packaging configuration file as per the previous paragraph and only require the necessary resources allowing the staller to continue to optimize away unneeded resources.
     
    You can disable appxbundle generation and include all packaged resources by setting the “Generate App Bundle” attribute to“never”.

    References:

    Make your app localizable

    Globalization and localization

    Localize strings in your UI and app package manifest

    Use the Multilingual App Toolkit 4.0



    Thursday, December 13, 2018 9:47 AM