Localization

• Sep 29, 2022
• 4 minutes to read

DevExpress Blazor components ship with localizable resources for UI elements, such as button captions, menu items, error messages, and dialog boxes. Our components use English as the default language. This topic describes how to localize DevExpress components for other languages.

View Example: How to localize DevExpress Blazor components

Predefined Satellite Assemblies

DevExpress components contain predefined satellite resource assemblies for the following languages:

• German
• Spanish
• Japanese

Use one of the following ways to add these languages to your application.

Project Wizard

Use the Project Wizard if you create a new project:

1. Run the Project Wizard from the DevExpress template gallery.

2. Switch to the Localization tab and select a culture:

   

3. Optional. Switch to the Settings tab and set the Add Rich Text Editor Resources option to True to add localization resources for the Rich Text Editor.
4. Click the Create Project button.

NuGet Packages

Use this approach if you want to add localization to an existing project or if you use a Microsoft Blazor Template to create a project:

1. In Visual Studio, select Tools → NuGet Package Manager → Manage NuGet Packages for Solution.
2. In the invoked dialog, select the DevExpress package source.

3. Find the DevExpress.Blazor.XX NuGet package with the required culture and install it:

   

4. Optional. Find the DevExpress.Blazor.RichEdit.XX NuGet package with the required culture and install it to localize the Rich Text Editor.

Locate Packages that Localize the Application

You can find localization packages in the Dependencies section of your Solution Explorer:

Satellite Assemblies for Other Cultures

In Blazor applications, DevExpress components use the standard localization mechanism from the .NET framework – Satellite Resource Assemblies (libraries that contain translated resources). Refer to the following MSDN article for more information: Create Satellite Assemblies for .NET Apps.

Use the DevExpress Localization Service to create and download a custom set of satellite assemblies, and modify resources.

Ensure that the major version of the satellite assemblies (for instance, v22.1) matches the major version of the DevExpress Blazor package in the project.

For more information on how to prepare and download resource assemblies, refer to the following video: DevExpress Localization: Getting Started.

To apply satellite assemblies for DevExpress Blazor components for other cultures, use an approach that corresponds to your application’s hosting model.

Blazor Server

Follow the steps below to add downloaded assemblies to your Blazor Server application:

1. Create a subdirectory in the application’s EXE file directory (usually in the bin\Debug\netX.X\ folder) with a name that corresponds to the resource’s culture (for example, bin\Debug\net6.0\it - to translate your application into Italian).
2. Unpack the archive with resources generated by the DevExpress Localization Service and copy the DevExpress.Blazor.v22.1.resources.dll file to the newly created subdirectory.
3. Change the application’s culture. Use one of approaches described in Microsoft documentation: ASP.NET Core Blazor globalization and localization.
4. Rebuild the application.

Blazor WebAssembly

Follow the steps below to add downloaded assemblies to your Blazor WebAssembly application:

1. Enable the BlazorWebAssemblyLoadAllGlobalizationData property in the project file:

     <PropertyGroup>
     ...
       <BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>
     </PropertyGroup>
   

2. Install the Microsoft.Extensions.Localization NuGet package.

3. Create the Resources folder in your Blazor project and copy the LocalizationRes.resx and LocalizationRes.<culture_name>.resx files from the DevExpressLocalizedResources_2022.1_<culture_name>\src\DevExpress.Blazor\Resources folder there. Make sure that the LocalizationRes.Designer.cs file exists. If this file is not present, open the LocalizationRes.resx file and set its Access Modifier property to Public.

   

4. Create a localization service:

   using System.Globalization;
   using DevExpress.Blazor.Localization;
   
   namespace BlazorWebAssembly.Services {
       public class LocalizationService : DxLocalizationService, IDxLocalizationService {
           string? IDxLocalizationService.GetString(string key) {
               return CultureInfo.CurrentUICulture.Name == "it-IT" ?
                   Resources.LocalizationRes.ResourceManager.GetString(key) :
                   base.GetString(key);
           }
       }
   }
   

5. Register this service in the Program.cs file:

   using System.Globalization;
   // ...
   using DevExpress.Blazor.Localization;
   using BlazorWebAssembly.Services;
   // ...
   builder.Services.AddSingleton(typeof(IDxLocalizationService), typeof(LocalizationService));
   

6. Change the application’s culture. Use one of approaches described in Microsoft documentation: ASP.NET Core Blazor globalization and localization.

7. Rebuild the application.