Post
Ask Question

Creating A Multilingual Application In Xamarin Android

Android loads text and media resources from the ‘res’ directory of the project. Additionally, Android can select and load resources from different directories, based on the current device configuration and locale.

In order to have a multilingual Android app, you need to provide Android with the localized resource files. If the locale is ‘en-US’, Android will look for a value of “R.string.title” by searching the files in the following order.

  • ‘res/values-en-rUS/strings.xml’
  • ‘res/values-en/strings.xml’
  • ‘res/values/strings.xml’

According to the Xamarin documentation, Android's localization strategy has the following key parts.

  • Resource folders to contain localized strings, images, and other resources.
  • GetText method, which is used to retrieve localized strings in code
  • @string/id in AXML files, to automatically place localized strings in layouts.

The translations go under folders named values-<language>. The language part of the folder name contains the language ISO code and an optional region code, preceded by lowercase r.

For example

  • Without region code - fr
  • With region code - fr-rFR or fr-rCA

This nomenclature uses the RFC (Request for Comments) standard definition 1766 (http://www.ietf.org/rfc/rfc1766.txt), which specifies a language and region using two-letter codes separated by a dash.

Our example application will translate text into buttons for English, Spanish, and Portuguese.

To do this, the application requires three strings.xml files, one for each - English, Spanish, and Portuguese. The procedure of creating strings.xml files is as follows.

  • Translate the strings.xml file to each language.
  • Create three new folders under res – values-en, values-es, and values-pt.
  • Place the translated strings.xml files in the respective folders.

To retrieve translated strings in code, use the GetText method and pass the resource ID used.

  1. Resources.GetText (Resource.String.app_name);   

Or use the GetString method to get the translated value of the resource.

  1. GetString (Resource.String.app_name)   

Let´s start and discuss step by step app development.

Step 1 Creating the Solution in VS

Open the VS 2015 Community and click New Project; Select the Visual C # language and the Android template -> Blank App (Android)

Enter the name Droid_Localization and click the OK button.

Step 2 Creating folders and translating texts

Open the Resources folder and inside, create another folder called values-pt where we will define the texts for the Portuguese language.

Right-click on the "values-pt" folder and then on Add-> New Item. Select the XML File template and enter the name Strings.xml.


Set the following content for the Strings.xml file in the values-pt folder.

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <resources>  
  3.   <string name="app">Localizacao Portugues</string>  
  4.   <string name="add">Incluir Tarefa</string>  
  5.   <string name="notes">Notas sobre a tarefa</string>  
  6.   <string name="done">Tarefa Concluída</string>  
  7.   <string name="cancel">Cancelar Tarefa</string>  
  8. </resources>   

Here, we defined the names properties for app, add, notes, done, and cancel, along with their respective values that will be displayed in the Portuguese language.

Repeat the above procedure and create another folder called "values-es" that should contain the text in Spanish. Create the Strings.xml file and set the following content in it.

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2.  <resources>  
  3.    <string name="app">Localizacion Espanhol</string>  
  4.    <string name="add">Agregar tarea</string>  
  5.    <string name="notes">Notas tarea</string>  
  6.    <string name="done">Tarea Completa</string>  
  7.    <string name="cancel">Cancelar la Tarea</string>  
  8.  </resources>   

Repeat the procedure again and create the "values-en" folder for the English text and set the contents of the Strings.xml file as below.

  1. <?xml version="1.0" encoding="utf-8" ?>  
  2.  <resources>  
  3.    <string name="app">Localization English</string>  
  4.    <string name="add">Add Task</string>  
  5.    <string name="notes">Notes about Task</string>  
  6.    <string name="done">Task Done</string>  
  7.    <string name="cancel">Cancel Task</string>  
  8.  </resources>   

At the end, our project should present the following files included in the Resources folder.


In this way, we already have the translated texts for the Portuguese, Spanish, and English languages and we can use them in our application. Note that the name property is the same in all files; only its value changes corresponding to the translation of its language.

Step 3 Defining the application layout file

Open the Main.axml file in the Resources/Layout folder in Designer mode, and then include 4 button controls.

Below, we can see the layout in the Xamarin Emulator and next to the generated XML code.


  1. <?xml version="1.0" encoding="utf-8"?>  
  2. lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.    android:orientation="vertical"  
  4.    android:layout_width="match_parent"  
  5.    android:layout_height="match_parent"  
  6.    android:minWidth="25px"  
  7.    android:minHeight="25px">  
  8.    <Button  
  9.        android:text="@string/add"  
  10.        android:layout_width="match_parent"  
  11.        android:layout_height="wrap_content"  
  12.        android:id="@+id/btnAdd" />  
  13.    <Button  
  14.        android:text="@string/notes"  
  15.        android:layout_width="match_parent"  
  16.        android:layout_height="wrap_content"  
  17.        android:id="@+id/btnNotes" />  
  18.    <Button  
  19.        android:text="@string/done"  
  20.        android:layout_width="match_parent"  
  21.        android:layout_height="wrap_content"  
  22.        android:id="@+id/btnDone" />  
  23.    <Button  
  24.        android:text="@string/cancel"  
  25.        android:layout_width="match_parent"  
  26.        android:layout_height="wrap_content"  
  27.        android:id="@+id/btnCancel" />  
  28. lt;/LinearLayout>  
In the layout file, we have defined each android: text property of the Buttons using the id corresponding to the property name of the resource file defined in the resource folders.

Step 4 Setting the MainActivity Code

Open the MainActivity file and include the code given below.

  1. using Android.App;  
  2. using Android.Widget;  
  3. using Android.OS;  
  4. namespace Droid_Localization  
  5. {  
  6.     [Activity(Label = "@string/app", MainLauncher = true, Icon = "@drawable/icon")]  
  7.     public class MainActivity : Activity  
  8.     {  
  9.         protected override void OnCreate(Bundle bundle)  
  10.         {  
  11.             base.OnCreate(bundle);  
  12.             // Set our view from the "main" layout resource  
  13.             SetContentView (Resource.Layout.Main);  
  14.             var btnCancel = FindViewById<Button>(Resource.Id.btnCancel);  
  15.             var btnAdd = FindViewById<Button>(Resource.Id.btnAdd);  
  16.             var btnNotes = FindViewById<Button>(Resource.Id.btnNotes);  
  17.             var btnDone = FindViewById<Button>(Resource.Id.btnDone);  
  18.             if (btnCancel != null)  
  19.             {  
  20.                 btnCancel.Text = GetString(Resource.String.cancel);   
  21.             }  
  22.             if (btnAdd != null)  
  23.             {  
  24.                 btnAdd.Text = Resources.GetText(Resource.String.add);    
  25.             }  
  26.             if (btnNotes != null)  
  27.             {  
  28.                 btnNotes.Text = Resources.GetText(Resource.String.notes);    
  29.             }  
  30.             if (btnDone != null)  
  31.             {  
  32.                 btnDone.Text = Resources.GetText(Resource.String.done);   
  33.             }  
  34.         }  
  35.     }  
  36. }   
This code only references the Main.axml Layout file and creates instances of each of the Buttons.

Next, we need to check if the instance of each Button is not null and to its Text property, we assign the value obtained from the resource file that we created in the Resources folder using the GetString() method. 

  1. If (btnCancel! = Null)  
  2.            {  
  3.                BtnCancel.Text = GetString (Resource.String.cancel);  
  4.            }   

When the application is executed, the device has a default language that is set in Custom Locale, as we can see below.


Running the project using Genymotion emulator, we will get the following result.


Summary

So, you have successfully created a multilingual Android app using Visual Studio and C#.

Note - This approach can be used to perform localization in small applications.


Similar Articles