Flex-internationalization

提供:Dev Guides
移動先:案内検索

フレックス-国際化

Flexは、Flexアプリケーションを国際化する2つの方法を提供します。プロジェクトで最も一般的に使用されているコンパイル時国際化の使用方法を示します。

Sr.No Technique & Description
1

Compile Time Internationalization

この手法は最も一般的であり、実行時のオーバーヘッドはほとんど必要ありません。は、定数文字列とパラメータ化された文字列の両方を変換するための非常に効率的な手法です。実装が最も簡単です。 コンパイル時間の国際化では、標準のプロパティファイルを使用して、翻訳された文字列とパラメーター化されたメッセージを保存します。これらのプロパティファイルは、アプリケーションで直接コンパイルされます。

2

Run Time Internationalization

この手法は非常に柔軟ですが、静的な文字列の国際化よりも時間がかかります。 ローカリゼーションプロパティファイルを個別にコンパイルし、アプリケーションの外部に残して、実行時にロードする必要があります。

Flexアプリケーションの国際化のワークフロー

ステップ1-フォルダー構造を作成する

Flexプロジェクトのsrcフォルダーの下にロケールフォルダーを作成します。これは、アプリケーションがサポートするロケールのすべてのプロパティファイルの親ディレクトリになります。 ロケールフォルダー内に、サポートするアプリケーションのロケールごとに1つのサブフォルダーを作成します。 ロケールの命名規則は次のとおりです。

{language}_{country code}

たとえば、en_USは米国の英語を表します。 ロケールde_DEはドイツ語を表します。 サンプルアプリケーションは、英語とドイツ語の2つの共通言語をサポートします。

ステップ2 –プロパティファイルを作成する

アプリケーションで使用されるメッセージを含むプロパティファイルを作成します。 この例では、 src> locale> en_US フォルダーの下に HelloWorldMessages.properties ファイルを作成しました。

enterName = Enter your name
clickMe = Click Me
applicationTitle = Application Internationalization Demonstration
greeting = Hello {0}

ロケール固有の翻訳された値を含むプロパティファイルを作成します。 この例では、 src> locale> de_DE フォルダーの下に HelloWorldMessages.properties ファイルを作成しました。 このファイルにはドイツ語の翻訳が含まれています。 _deはドイツ語のロケールを指定し、アプリケーションでドイツ語をサポートします。

Flash Builderを使用してプロパティファイルを作成している場合は、ファイルのエンコーディングをUTF-8に変更します。ファイルを選択して右クリックし、プロパティウィンドウを開きます。 変更を適用して保存します。

enterName = Geben Sie Ihren Namen
clickMe = Klick mich
applicationTitle = Anwendung Internationalisierung Demonstration
greeting = Hallo {0}

ステップ3 –コンパイラオプションを指定する

  • プロジェクトを右クリックして[プロパティ]を選択します。
  • Flexコンパイラを選択し、追加のコンパイラ引数設定に次を追加します-
-locale en_US de_DE
  • プロジェクトを右クリックして[プロパティ]を選択します。
  • Flexビルドパスを選択し、ソースパス設定に次を追加します-
src\locale\{locale}

内部化の例

次の手順に従って、Flexアプリケーションの内部化手法をテストします-

Step Description
1 Create a project with a name HelloWorld under a package com.finddevguides.client as explained in the Flex - Create Application chapter.
2 Modify HelloWorld.mxml as explained below. Keep rest of the files unchanged.
3 Compile and run the application to make sure business logic is working as per the requirements.

以下は、変更されたmxmlファイル src/com.finddevguides/HelloWorld.mxml の内容です。

<?xml version = "1.0" encoding = "utf-8"?>
   <s:Application xmlns:fx = "http://ns.adobe.com/mxml/2009"
   xmlns:s = "library://ns.adobe.com/flex/spark"
   xmlns:mx = "library://ns.adobe.com/flex/mx"
   minWidth = "500" minHeight = "500">

   <fx:Metadata>
      [ResourceBundle("HelloWorldMessages")]
   </fx:Metadata>

   <fx:Style source = "/com/finddevguides/client/Style.css"/>
   <fx:Script>
      <![CDATA[
         import mx.controls.Alert;
         [Bindable]
         private var locales:Array =  [{label:"English", locale:"en_US"},
            {label:"German", locale:"de_DE"}];

         private function comboChangeHandler():void {
           resourceManager.localeChain = [localeComboBox.selectedItem.locale];
         }

         protected function clickMe_clickHandler(event:MouseEvent):void {
            var name:String = txtName.text;
            var inputArray:Array = new Array();
            inputArray.push(name);
            Alert.show(resourceManager.getString('HelloWorldMessages'
               ,'greeting',inputArray));
         }
      ]]>
   </fx:Script>

   <s:BorderContainer width = "500" height = "500" id = "mainContainer"
      styleName = "container">
      <s:VGroup width = "100%" height = "100%" gap = "50"
      horizontalAlign = "center" verticalAlign = "middle">

         <s:Label id = "lblHeader" fontSize = "40"
            color = "0x777777"
            text  = "{resourceManager.getString('HelloWorldMessages','applicationTitle')}"
            styleName = "heading" width = "90%" height = "150"/>

         <s:Panel width = "300" height = "150">
            <s:layout>
               <s:VerticalLayout paddingTop = "10" paddingLeft = "10"/>
            </s:layout>

            <s:HGroup >
               <s:Label text = "{resourceManager.getString('HelloWorldMessages','enterName')}"
                  paddingTop = "2"/>
               <s:TextInput id = "txtName"/>
            </s:HGroup>

            <s:Button
               label = "{resourceManager.getString('HelloWorldMessages','clickMe')}"
               click = "clickMe_clickHandler(event)" right = "10"/>
         </s:Panel>

         <mx:ComboBox id = "localeComboBox" dataProvider = "{locales}"
            change = "comboChangeHandler()"/>
      </s:VGroup>
   </s:BorderContainer>
</s:Application>

すべての変更が完了したら、link:/flex/flex_create_application [Flex-アプリケーションの作成]の章で行ったように、アプリケーションを通常モードでコンパイルして実行します。 アプリケーションに問題がなければ、次の結果が生成されます。[link:/flex/samples/I18NApplicationl [オンラインで試す]]

flex内部化

言語ドロップダウンを使用して言語を変更し、結果を確認します。

flex Internalization 1