Android Building Multi-Language Supported App

Android is one of the few popular mobile operating systems having millions of users over 190 countries and growing day by day. So when you are aiming your app to be globally successful, it is always a good idea to make the app localized.

While localizing, you should consider using appropriate text, audio, currency, numbers and graphics depending upon the region or country. But this tutorial only covers localizing strings i.e supporting multiple languages. Localizing with Resources explains about other things should be considered when localizing your app.

1. How String Localization Works

By default android considers English as primary language and loads the string resources from res ⇒ values ⇒ strings.xml. When you want to add support for another language, you need to create a values folder by appending an Hyphen and the ISO language code. For example if you want to add support for French, you should create a values folder named values-fr and keep a strings.xml file in it with all the strings translated into French language.

In brief the localization works as follows

1. When user changes the device language through Settings ⇒ Language & Input, android OS itself checks for appropriate language resources in the app. (Let’s say user is selecting French)

2. If the app supports selected language, android looks for it’s string resources in values-(ISO language Code) folder in the project. (For french it loads the string values from values-fr/string.xml)

3. If the supported language strings.xml misses any string value, android always loads the missing strings from default strings.xml file i.e values/strings.xml

So it is mandatory that the default stings.xml file should contains all the string values that app uses. Other wise the app will crash with Force Close error.

Do’s:

While you are supporting multiple languages, you should consider below as a best practice while defining the strings. Always declare the string in strings.xml only.

<string name="note_email">Enter your email address</string>

When referring it in xml, use @strings notation.

<TextView ...   android:text="@string/note_email"  />

When defining the string through java code, use R.string

emailNote.setText(R.string.note_email);

Don’ts:

Never hard code the string in xml or in java code which make the translation difficult.

<TextView ...   android:text="Enter your email address"  />

emailNote.setText("Enter your email address");    

So let’s create a new project and try with an example.

2. Creating New Project

1. Create a new project in Eclipse by going to File ⇒ New ⇒ Android Application Project and fill the required information.

2. Add following colors in colors.xml located under values. If you don’t see colors.xml, create a new file and add the below colors.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="white">#ffffff</color>
    <color name="bg_gradient_start">#b21331</color>
    <color name="bg_gradient_end">#820d2a</color>
    <color name="bg_button_login">#380813</color>
</resources>

3. Under drawable folder create three files named bg_button_rounded.xml,bg_form_rounded.xml, bg_gradient.xml with following contents. These files are not related to language support, but just to give nice gradients background and rounded corners to buttons, input boxes.

bg_button_rounded.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
 
    <!-- view background color -->
    <solid
        android:color="@color/bg_button_login" >
    </solid>
 
    <!-- If you want to add some padding -->
    <padding
        android:left="5dp"
        android:top="5dp"
        android:right="5dp"
        android:bottom="5dp"    >
    </padding>
 
    <!-- Here is the corner radius -->
    <corners
        android:radius="6dp"   >
    </corners>
 
</shape>

bg_form_rounded.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
 
    <!-- view background color -->
    <solid
        android:color="@color/white" >
    </solid>
 
    <!-- If you want to add some padding -->
    <padding
        android:left="5dp"
        android:top="5dp"
        android:right="5dp"
        android:bottom="5dp"    >
    </padding>
 
    <!-- Here is the corner radius -->
    <corners
        android:radius="6dp"   >
    </corners>
 
</shape>

bg_gradient.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <gradient
        android:gradientRadius="750"
        android:endColor="@color/bg_gradient_end"
        android:startColor="@color/bg_gradient_start"
        android:type="radial" />
</shape>

4. Open strings.xml located under values folder and add following strings. These are default English language strings.

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="app_name">Multi Language App</string>
    <string name="action_settings">Settings</string>
    
    <string name="welcome">Welcome!</string>
    <string name="email">Email Address</string>
    <string name="password">Password</string>
    <string name="login">Login</string>
    <string name="signup">Don\'t have account? Sign Up</string>

</resources>

5. Now under res folder create three folders named values-de, values-fr, values-hi, values-ja and a strings.xml file in each of the folders.

Your project should look like this once you created the required files/folders.

Now translate the strings into respected languages and place them in appropriate strings.xml files.

Deutsch values-de/strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    
    <string name="welcome">Willkommen!</string>
    <string name="email">Email Addresse</string>
    <string name="password">passowrd</string>
    <string name="login">Login</string>
    <string name="signup">müssen nicht angemeldet? Anmeldung</string>

</resources>

French values-fr/strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    
    <string name="welcome">accueil</string>
    <string name="email">adresse e-mail</string>
    <string name="password">mot de passe</string>
    <string name="login">connexion</string>
    <string name="signup">Ne pas avoir un compte? signer</string>

</resources>

Hindi values-hi/strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    
    <string name="welcome">स्वागतम</string>
    <string name="email">ईमेल पता</string>
    <string name="password">पासवर्ड</string>
    <string name="login">लॉगिन</string>
    <string name="signup">खाता नहीं है? साइन अप करें</string>

</resources>

Japanese values-ja/strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    
    <string name="welcome">歓迎</string>
    <string name="email">電子メールアドレス</string>
    <string name="password">パスワード</string>
    <string name="login">ログイン</string>
    <string name="signup">アカウントをお持ちでない場合は？サインアップ</string>

</resources>

6. Open your main activity layout file (in my case activity_main.xml) and add the following content to create a simple layout. This layout contains a title and a login form.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bg_gradient"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:gravity="center"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="40dp"
            android:text="@string/welcome"
            android:textColor="@color/white"
            android:textSize="45dp"
            android:textStyle="bold" />

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/bg_form_rounded"
            android:orientation="vertical" >

            <EditText
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="10dp"
                android:background="@null"
                android:hint="@string/email"
                android:padding="5dp" 
                android:singleLine="true"/>

            <EditText
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:background="@null"
                android:hint="@string/password"
                android:inputType="textPassword"           
                android:padding="5dp" />
        </LinearLayout>

        <Button
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="25dp"
            android:background="@drawable/bg_button_rounded"
            android:text="@string/login" 
            android:textColor="@color/white"/>
    </LinearLayout>
    
    <TextView android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/signup"
        android:layout_alignParentBottom="true"
        android:gravity="center_horizontal"
        android:layout_marginBottom="25dp"
        android:textColor="@color/white"/>

</RelativeLayout>

7. Open your MainActivity.java and make sure that it has following code. This code will be added automatically when you create new project.

package info.androidhive.multilanguageapp;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		getActionBar().hide();
	}
}

Now if you run the project you should see the app in English (assuming that your device is set to English language)

3. Testing The Other Languages

In order to see the app in other languages follow below steps or check the above demo video.

1. On the device go to Settings ⇒ Language & Input
2. Select the Language and choose the language that you supported in the app.

4. Android Localization Language ISO Codes

Below table give you ISO languages codes for all the languages that android supports.

Language	Locale	values/strings.xml
German	de	values-de/strings.xml
Chinese	zh	values-zh/strings.xml
Czech	cs	values-cs/strings.xml
Dutch	nl	values-nl/strings.xml
French	fr	values-fr/strings.xml
Italian	it	values-it/strings.xml
Japanese	ja	values-ja/strings.xml
Korean	ko	values-ko/strings.xml
Polish	pl	values-pl/strings.xml
Russian	ru	values-ru/strings.xml
Spanish	es	values-es/strings.xml
Arabic	ar	values-ar/strings.xml
Bulgarian	bg	values-bg/strings.xml
Catalan	ca	values-ca/strings.xml
Croatian	hr	values-hr/strings.xml
Danish	da	values-da/strings.xml
Finnish	fi	values-fi/strings.xml
Greek	el	values-el/strings.xml
Hebrew	iw	values-iw/strings.xml
Hindi	hi	values-hi/strings.xml
Hungarian	hu	values-hu/strings.xml
Indonesian	in	values-in/strings.xml
Latvian	lv	values-lv/strings.xml
Lithuanian	lt	values-lt/strings.xml
Norwegian	nb	values-nb/strings.xml
Portuguese	pt	values-pt/strings.xml
Romanian	ro	values-ro/strings.xml
Serbian	sr	values-sr/strings.xml
Slovak	sk	values-sk/strings.xml
Slovenian	sl	values-sl/strings.xml
Swedish	sv	values-sv/strings.xml
Tagalog	tl	values-tl/strings.xml
Thai	th	values-th/strings.xml
Turkish	tr	values-tr/strings.xml
Ukrainian	uk	values-uk/strings.xml
Vietnamese	vi	values-vi/strings.xml

Source: http://bit.ly/1qYfHDL

5. Translation Services

Right now I used Google Translate service to translate the strings into other languages. But if you want more accurate and meaningful translation always go for professional services like Professional translations through Google Play

Finally Localization Checklist gives you list of things to be verified before the app goes live when localization considered.

http://www.androidhive.info/2014/07/android-building-multi-language-supported-app/