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.

Android Building Multi-Language Supported

In this article we are going to build a Multi-Language supported app that supports French, Deutsch (German), Hindi and Japanese.


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.

android mult language support project structure

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)

android-multi-language-app-english

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.

android-multi-language-app-hindi
android-multi-language-app-deutsch
android-multi-language-app-french
android-multi-language-app-japanese

4. Android Localization Language ISO Codes

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

LanguageLocalevalues/strings.xml
Germandevalues-de/strings.xml
Chinesezhvalues-zh/strings.xml
Czechcsvalues-cs/strings.xml
Dutchnlvalues-nl/strings.xml
Frenchfrvalues-fr/strings.xml
Italianitvalues-it/strings.xml
Japanesejavalues-ja/strings.xml
Koreankovalues-ko/strings.xml
Polishplvalues-pl/strings.xml
Russianruvalues-ru/strings.xml
Spanishesvalues-es/strings.xml
Arabicarvalues-ar/strings.xml
Bulgarianbgvalues-bg/strings.xml
Catalancavalues-ca/strings.xml
Croatianhrvalues-hr/strings.xml
Danishdavalues-da/strings.xml
Finnishfivalues-fi/strings.xml
Greekelvalues-el/strings.xml
Hebrewiwvalues-iw/strings.xml
Hindihivalues-hi/strings.xml
Hungarianhuvalues-hu/strings.xml
Indonesianinvalues-in/strings.xml
Latvianlvvalues-lv/strings.xml
Lithuanianltvalues-lt/strings.xml
Norwegiannbvalues-nb/strings.xml
Portugueseptvalues-pt/strings.xml
Romanianrovalues-ro/strings.xml
Serbiansrvalues-sr/strings.xml
Slovakskvalues-sk/strings.xml
Slovenianslvalues-sl/strings.xml
Swedishsvvalues-sv/strings.xml
Tagalogtlvalues-tl/strings.xml
Thaithvalues-th/strings.xml
Turkishtrvalues-tr/strings.xml
Ukrainianukvalues-uk/strings.xml
Vietnamesevivalues-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.

Ravi is hardcore Android programmer and Android programming has been his passion since he compiled his first hello-world program. Solving real problems of Android developers through tutorials has always been interesting part for him.