Start from scratch-go deep into Android (practice-let's start writing code-Beginner's Guide-3. Hello, localization)

Chapter 2 Hello, l10n (localization)

In this chapter, we will create a hello, l10n application that will selectively load some resources based on the android framework. Then we add some resources to the res/directory and use this method to localize our applications.

3.1 create an unlocalized Application

In the first hello, l10n version, we only use the default resource directories (RES/drawable, Res/layout, Res/values ). These resources are not localized-they are commonly used graphics, la S, strings, and so on. In the default language environment, resources in these default directories are loaded. The application contains a simple user interface that displays two textview objects and an image button. When you click the button, the alertdialog object is displayed to display additional text.

3.1.1Create a project and Layout

For this program we use the simulator, the default language is English, the default region is UK.

1. Create a "hellol10n" project and fill in the following fields

Project name: hellol10n

Application name: Hello, l10n

Package name: COM. example. hellol10n

Create activity: hellol10n

Min SDK version: 4

At present, the author's eclipse will automatically create the following directory structure. Note that not all eclipse is created in this way. It may vary depending on the version of your ADT plug-in. We also need to add some folders. 3-1:

 

Figure 3-1Directory structure after eclipse creates a project

2. Open Res/layout/Main. XML to modify the code, as shown in "code list 3-1:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    ><TextView    android:layout_width="fill_parent"     android:layout_height="wrap_content"    android:gravity="center_horizontal"    android:text="@string/text_a"    /><TextView    android:layout_width="fill_parent"    android:layout_height="wrap_content"    android:gravity="center_horizontal"    android:text="@string/text_b"    /><Button    android:id="@+id/flag_button"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_gravity="center"    /></LinearLayout>

Code List 3-1

3.1.2Create default Resource

1. Open Res/values/strings. xml and add the code, as shown in "code list 3-2:

<?xml version="1.0" encoding="utf-8"?><resources>    <string name="app_name">Hello, L10N</string>    <string name="text_a">Shall I compare thee to a summer"'"s day?</string>    <string name="text_b">Thou art more lovely and more temperate.</string>    <string name="dialog_title">No Localisation</string>    <string name="dialog_text">This dialog box"'"s strings are not localised. For every locale, the text here will come from values/strings.xml.</string></resources>

Code List 3-2

Because our default simulator environment is English, we use English here. In fact, we will add some other languages later.

2. Add the flag image to RES/drawable. If there is no new one in this directory, the image will be used if there is no localized program.

(Flag.png)

3. Open hellol10n. Java in oncreate () in setcontentview () and add the code "code list 3-3"

// Adjust the current language environment to flag.png (of course, we only apply to the default situation, so no matter what language environment is displaying the British flag) button B; (B = (button) findviewbyid (R. id. flag_button )). setbackgrounddrawable (this. getresources (). getdrawable (R. drawable. flag); // generate a dialog box. When the user clicks the flag, the dialog box alertdialog is displayed. builder = new alertdialog. builder (this); builder. setmessage (R. string. dialog_text ). setcancelable (false ). settitle (R. string. dialog_title ). setpositivebutton ("done", new dialoginterface. onclicklistener () {public void onclick (dialoginterface dialog, int ID) {dialog. dismiss () ;}}); Final alertdialog Alert = builder. create (); // when a button with a flag is clicked, the created dialog box B is displayed. setonclicklistener (new view. onclicklistener () {public void onclick (view v) {alert. show ();}});

 

Code List 3-3

3.2 run unlocalized applications

Save our code and run the application. The running result should be 3-2:

Effect after running	Effect after clicking the flag

Figure 3-2After running a local project

3.3 localization Planning

The first step in localized applications is to plan the regions where our applications need to be presented. In this application, the default language environment is UK. We will add some specific information to the regions of China, Germany, and France. Table 3-1 shows the regions to be planned.

Table 1

Region/Language	UK	Germany	France	China	Other countries
English	English, English flag by default	-	-		English, English flag by default
German	-	German flag and German text, modifyapp_name,text_a,text_b;	-	-
French	-	-	French flag and German text, modifyapp_name,text_a,text_b;
China	-	-	-	-Modify the Chinese flag and text app_name,text_a,text_b;
Other languages					English, English flag by default

Table 3-1Regions planned in localized applications

According to the above plan, in addition to the UK, we also need to add strings. XML for three countries. Note that a language may apply to many regions, such as English. The following table 3-2 is the name extension for the corresponding country. For more information, see ISO639-1 (language), ISO3166-1-alpha-2 (region)

Local Code	Language/Country	Local strings. xml	Flag.png
Default	English/UK	Res/values/	Res/drawable/
De-RDE	German/German	Res/Values-de/	Res/drawable-de-RDE/
Fr-RFR	French/French	Res/Values-fr/	Res/drawable-fr-RFR/
Zh-RCN	Chinese/China	Res/Values-zh/	Res/drawable-ZH-RCN/

Table 3-2Country abbreviation

During running, the system automatically loads images and text based on the region and language selected by the local device. If no country or region is available, the default British flag and English are displayed.

3.4 localized applications

3.4.1Localized string

We need to create three additional strings. XML files, corresponding to German, French, and Chinese. With eclipse, this will make our work much easier.

1. Select File> New> Android XML file.

2. select our l10n project, and then enter strings. XML in the file column. Select the language below and click the-> button to insert it to the right. 3-3:

Figure 3-3

3. Enter de here to automatically create Res/Values-de/strings. xml. 3-4:

 

Figure 3-4

3. The remaining creation methods are the same. Please create them one by one:
Res/Values-fr/
Res/Values-zh/

4. Add the following text to the corresponding strings. XML, as shown in Table 3-3:

File	Code:
res/values-de/strings.xml	<?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">Hallo, Lokalisierung</string> <string name="text_a">Soll ich dich einem Sommertag vergleichen,</string> <string name="text_b">Der du viel lieblicher und sanfter bist?</string> </resources>
res/values-fr/strings.xml	<?xml version="1.0" encoding="utf-8"?> <resources> <string name="app_name">Bonjour, Localisation</string> <string name="text_a">Irai-je te comparer au jour d'été?</string> <string name="text_b">Tu es plus tendre et bien plus tempéré.</string> </resources>
res/values-zh/strings.xml	<? XML version = "1.0" encoding = "UTF-8"?> <Resources> <string name = "app_name"> hello, localization </string> <string name = "text_a"> summer </string> <string name = "text_ B"> you are more gentle and cute </string> </resources>

Table 3-3National text

3.4.2Localized Images

 

(RES/drawable-de-RDE/flag.png) Germany

(RES/drawable-fr-RFR/flag.png) France

(RES/drawable-ZH-RCN/flag.png) China

3.5 execute and test localized applications

Once you add localized strings and image resources, prepare to run and test the application. First, we need to change the region settings of the device or simulator. Some devices may not be able to set regions and languages. But in the simulator, there is an image on the desktop for our convenience, 3-5:

 

Figure 3-5

When selecting a language, we need to long press a list, as shown in 3-6:

 

Figure 3-6

After running the program, we will see the desired results.