Internationalization in Flex
The flex site I am working on need internationalization. So of course I googled a bit and found some informations on how to use i18n in Flex. And the only really good answer I found was doing different builds using resources.
However I need i18n at runtime, it is something the client needs, and I don’t want the user to reload the whole flex app when he wishes to change language.
I googled a bit more and found a blog post that explained how to get this to work … But could understand anything :
http://jeff.mxdj.com/internationalizing_flex_2_apps_pt_2.htm
So I am doing here a doable tutorial :
- create a Flex project.
- create a locale directory at the flex root
- add -sp locale to your flex compile options (right click, properties, flex compiler with eclipse) to add it to classpath
- create a fra.properties and an eng.properties file in the locale directory
- in the fra.properties, add the line : hello=salut
- in the eng.properties, add the line : hello=hi
- now let’s get to the code
We create a singleton that will take care of all this.
package
{
import mx.resources.ResourceBundle;
import flash.events.Event;public class Localizator
{public static const FRENCH:int = 1;
public static const ENGLISH:int = 2; protected static var myLocalizator:Localizator;[Bindable]
private var cur:ResourceBundle;[ResourceBundle("eng")]
private var rb_eng:ResourceBundle;
[ResourceBundle("fra")]
private var rb_fra:ResourceBundle;private var _lang:int;
public function Localizator (language:int=ENGLISH){
selectLang( language );
}
private function selectLang( language:int ) : void{
this._lang = language;
switch ( language ) {
case ENGLISH :this.cur = rb_eng;
break;case FRENCH :
this.cur = rb_fra;
break;default :
this._lang = Localizator.ENGLISH;
this.cur = rb_eng;
break;}
}
public static function getInstance (language:int) : Localizator {
if( Localizator.myLocalizator == null ){
Localizator.myLocalizator = new Localizator(language);
}
return Localizator.myLocalizator;}
[Bindable(event="langChange")]
public function getText( key:String ) : String {return this.cur.getString( key );
}
/**
* Shortcut for getText
*/
[Bindable(event="langChange")]
public function gT( key:String ) : String {return this.getText(key);
}
public function get lang () : int {
return this._lang;
}
public function set lang ( language:int ) : void {
if( this._lang != language ){
this.selectLang( language );
var e:Event = new Event(”langChange”);
this.dispatchEvent(e);}
}
}
}
You can now create a file, and for example add a lable with text=”{Localizatior.getInstance().gT(’hello’)}” and a button that will change the language of the localizator.
This example is pretty dirty but adapt it to match your needs and you should have an easy way to have an international app.
