Localize UI Elements

• Jul 02, 2021
• 2 minutes to read

This lesson explains how to localize an XAF ASP.NET Core Blazor application. It describes how to translate UI elements into German and create a multi-language application.

Note

For more information on localization, review the following topics:

• How to: Localize an XAF .NET 5 Application
• Localization Basics

Step-by-Step Instructions

1. Add the DevExpress.ExpressApp.de, DevExpress.ExpressApp.Blazor.de and DevExpress.ExpressApp.Security.de packages to the MySolution.Blazor.Server project.

   

2. Open the appsettings.json file from the MySolution.Blazor.Server project. Add the German language to the DevExpress:ExpressApp:Languages section and enable the runtime language switcher:

   appsettings.json

   { 
       // ... 
       "DevExpress": { 
           "ExpressApp": { 
               "Languages": "en;de",
               "ShowLanguageSwitcher": true,  
                // ...
           } 
       } 
   }  
   

   See the Current Culture in XAF ASP.NET Core Blazor Applications help section for more information on how an XAF ASP.NET Core Blazor application determines the default language.

3. In the MySolution.Module project, double-click the Model.DesignedDiffs.xafml file to invoke the Model Editor. Focus on the root MySolution node and click Languages Manager… in the Language combo box on the Model Editor Toolbar.

   

   Add the target language in the invoked dialog and click OK.

   

   Restart Visual Studio to load localized values from satellite assemblies.

   In the Solution Explorer, right-click the Model.DesignedDiffs.Localization.de.xafml file and call its Properties window. Make sure that the Build Action field is set to Embedded resource.

4. Select the newly added language in the Language combo box.

   

   Set German values for properties denoted by the “globe” glyph in all the nodes and child nodes to localize your application.

   

5. Run the application. Click the gear icon to display the settings menu and switch the language to German.

   

6. Check whether you translated all required items.

   

   Detailed Explanation

   Languages

   You can use pre-installed languages: German (de), Spanish (es), Japanese (ja), and Russian (ru) to localize an application. These assemblies are available in DevExpress Local NuGet Feed. For other languages, use the Localization Service to download satellite assemblies. See the Localize Standard XAF Modules and DevExpress Controls Used in an Application topic for more information on how to use this service to localize XAF modules.

   Required Nuget Packages

   To localize an application, install packages with the same names and a language postfix from the Packages section of the MySolution.Blazor.Server project. For example, if you want to use German (the .de postfix) and the Packages section includes the DevExpress.ExpressApp.Blazor package, install the DevExpress.ExpressApp.Blazor.de package.

   Next Lesson

   Add an Editor to a Detail View