Xamarin.Forms - Multilingual App


This article demonstrates how to enable support for multiple languages in Xamarin.forms application. This means if the user has enabled the Tamil language to their smartphone, then the application shows the content in Tamil.There is no default function available for multi-language application. So, we need to add a plug-in for this.
NuGet Package: Xamarin: search "Plugin.Multilingual"
  • Multilingual Plugin for Xamarin.Forms, Xamarin Android, Xamarin.IOS, Xamarin.Mac, tvOS, watchOS and Universal Windows Platform
  • Simple cross-platform plugin for handling languages localization

Multilingual Plugin Features

  •  Get and set current culture
  •  Get device culture
  •  Get culture list
  •  Get specific culture by name
  • More Detail

Let's start  :)

Step 1

You can create Xamarin.forms app by going to File ->>New ->>Visual C# >>Cross platform >>Cross platform App (Xamarin.Native or Xamarin.Forms), give the application name, and press OK.

(Project name: MultilingualApp)
Step 2

After the project creation, add the following NuGet packages for your project.
For that, go to Solution Explorer and select your project solution. Right-click and select "Manage NuGet Packages for the Solution". In the popup window, click open "Browse" tab and browse "Plugin.Multilingual". Now, select the NuGet package and select your project to install it.

Step 3

When installing the plugin, it will create a TranslateExtension.txt file in Helpers folder. Rename the extension for this to TranslateExtension.cs. In TranslateExtension.cs file in the constant ResourceId by default, it will assume your resource file is added to the root of the project and the resx file is named as Appresources. If you added a file named the resx file differently, you can change it there.

  1. using System;  
  2. using System.ComponentModel;  
  3. using System.Reflection;  
  4. using System.Resources;  
  5. using Plugin.Multilingual;  
  6. using Xamarin.Forms;  
  7. using Xamarin.Forms.Xaml;  
  9. namespace MultilangualApp.Helpers  
  10. {  
  11.     [ContentProperty("Text")]  
  12.     public class TranslateExtension : IMarkupExtension  
  13.     {  
  14.         const string ResourceId = "MultilangualApp.AppResources";  
  16.         static readonly Lazy<ResourceManager> resmgr =  
  17.             new Lazy<ResourceManager>(() => new ResourceManager(ResourceId, typeof(TranslateExtension).GetTypeInfo().Assembly));  
  19.         public string Text { get; set; }  
  21.         public object ProvideValue(IServiceProvider serviceProvider)  
  22.         {  
  23.             if (Text == null)  
  24.                 return "";  
  26.             var ci = CrossMultilingual.Current.CurrentCultureInfo;  
  28.             var translation = resmgr.Value.GetString(Text, ci);  
  30.             if (translation == null)  
  31.             {  
  33. #if DEBUG  
  34.                 throw new ArgumentException(  
  35.                     String.Format("Key '{0}' was not found in resources '{1}' for culture '{2}'.", Text, ResourceId, ci.Name),  
  36.                     "Text");  
  37. #else  
  38.                 translation = Text; // returns the key, which GETS DISPLAYED TO THE USER  
  39. #endif  
  40.             }  
  41.             return translation;  
  42.         }  
  43.     }  
  44. }  
Step 4

Create AppResources.resx file. For that, go to Solution Explorer >> MultilingualApp(PCL) >> Visual C# items >> select "Text File" and give the file name AppResources.resx. Double-click to open AppResources.resx file and enter the values, keys.

Step 5

Similarly, create AppResources.es.resx file and enter the values and keys.
Step 6

Add another AppResources.resx file named AppResources.ar.resx file.Apply the values and keys.
Step 7

In this step, add a Translate control to your project. For that, go to Solution Explorer >> MultilingualApp(PCL) >> double click on MainPage.xaml.

After opening this, you can add Translate control assembly and XAML code to your project. Write the code given below.
  1. xmlns:translator="clr-namespace:MultilangualApp.Helpers"  
Xaml code
  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"  
  3.              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"  
  4.              xmlns:local="clr-namespace:MultilangualApp"  
  5.              x:Class="MultilangualApp.MainPage"  
  6.              xmlns:translator="clr-namespace:MultilangualApp.Helpers">  
  8.     <Label Text="{translator:Translate HelloMessage}"   
  9.            VerticalOptions="Center"   
  10.            HorizontalOptions="Center" />  
  12. </ContentPage> 
Step 8

Click 'F5' or build to run your project. Running this project, you will have the result like below.

Now, you can change your simulator language and relaunch you Xamarin.forms application. The result will look like below.

Finally, we have successfully created a Xamarin.forms multilingual application.

Similar Articles