With Flex 3 comes the ability to do runtime localization. Compared to Flex 2 where you actually had to recompile your application for each locale, you can now have one version of your application that contains different resource bundles.
Today I implemented this in one of the applications we are working on and ran into some issues. Here is how I got it to work in a nutshell. (Note: for a full instruction on implementing localization in Flex 3, I recommend the article Flex 3:Feature Introductions: Runtime Localization by Gordon Smith.)
- create a folder in your project to store your resource bundles (e.g. "locale")
- create a subfolder for each locale you want to implement (e.g. "locale\nl_BE" and "locale\fr_BE")
- in the locale subfolder, create a resources.properties file and save it as UTF-8
- enter the resources in the form of "key=value", like Ant property files
- update the compiler settings: -locale=nl_BE,fr_BE -source-path=locale/{locale}
You now also need to create localized framework resources. To do this, take the following steps:
- open a command line (run as administrator in Vista!)
- go to the "bin" folder in your Flex SDK installation folder
- run the copylocale.exe tool for each locale, this will copy the localized framework files from one locale to another (copylocale en_US nl_BE)
- check FLEX_HOME\frameworks\locale to see if the folder for your new locale has been created
- if you get an error "could not find resource bundle charts", search for a file called charts_rb.swc and copy it to the new locale folder in FLEX_HOME\frameworks\locale
A simple example of asking for a localized string:
-
// tell the compiler what resourcebundle to use
-
<mx:Metadata>
-
[ResourceBundle("resources")]
-
</mx:Metadata>
-
-
// if you are in a subclass of UIComponent
-
var myString:String = resourceManager.getString("resources", "myKey");
-
-
// ...or if you are not in a subclass of UIComponent
-
var myString:String = ResourceManager.getInstance().getString("resources", "myKey");
You can put these calls in a binding expression and switch your locale at runtime by setting the localeChain property on the resourceManager:
-
resourceManager.localeChain = ["nl_BE"];
That's about it. Have fun!
Add to Bloglines - Digg This! - del.icio.us - Stumble It! - Twit This! - Technorati links - Share on Facebook - Feedburner
Christophe Herreman is a software developer living in Belgium. He's working on high-end Flex and AIR solutions at 
March 28th, 2008 at 1:13 am
Christophe,
Nice work, but i’m still trying to solve something out. How do i detect the language of the user and set it at runtime. I’ve done something with javascript but the navigator.userLanguage (and others) seem to be undefined for Firefox and Explorer. I’m able to change the language with a combo that displays the available languages but thats all. Thanks in advance.
March 29th, 2008 at 7:57 am
Hi German,
maybe this will be of any help: http://www.actionscript.org/forums/showthread.php3?t=162137
April 4th, 2008 at 9:34 pm
This is very similar to the approach I’m taking in an application. I have a few additional requirements re: i18n that are giving me pause. Perhaps they are more related to project structure. I have 3 places where my localized resources must be used. 1) The main application SWF, 2) modules which are used by the application (including possibly RSL), and 3) component SWCs that we are using which will cross application boundaries. I’ve broken the bundles into two, System and Application to allow the SWCs to be able to access common system level translations like OK, Cancel and the like. The issue I’ve having is how to get the projects to recognize the resources without manually copying them into each project. When I add the MXML Meta tag for the resource in the SWC library project components ie. [ResourceBundle("System")], the compiler can’t resolve the reference. How should I be thinking about this??? Thanks fro any light you can add to this problem.
May 4th, 2008 at 1:27 pm
Hi,
I want to create aflex app. using ResourceBundles but without using the copylocale command, so i want to use just the property files loaded.
Flex 3 documentation says: The localeChain property is an Array so that the ResourceManager can support incomplete locales. … If the resource is not found there, then the ResourceManager searches for the resource in the en_US bundle…
It seems to me that isn’t working, if i compile my flex app with -locale en_US,en_HU , it’s always searching for locale\en_HU framework.swc files.
Do you think i misunderstanded something or do something wrong?
Thanks,
Andrew
May 4th, 2008 at 1:55 pm
problem solved.
flex builder needs an empty locale directory (like: C:\Program Files\Adobe\Flex\frameworks\locale\hu_HU\ ), but not any swc files.
May 27th, 2008 at 7:09 am
Ho do I get a class to update when the bundles is changed. I can get the class to use the resouces like this
[ResourceBundle("forms")]
public class MultiFileUpload extends UIComponent { … }
and set values in the class with resourceManager.getString(‘form’,'MY_KEY’)
but how/can do I get them to update AFTER the class has been instantiated?
For example I have a FileUpload class and want UI elements (column titles of a file list data grid) to changes if the language is changed.
May 28th, 2008 at 12:11 am
I’ve got the multi-language localization with RSL’s to work just fine.
But as with most applications, everything doesn’t reside in the
application page, so what I would like to do is somehow put the resource
bundle into the model (in Cairngorm) so it can be accessed in all
components that use the modellocator, instead of having to use the
application scope because thats where the ResourceBundle Metadata is…
I could use Application.application.resourceManager… for everything
but I would rather have it in the model and be able to change the
localeChain of the resourceManager in the model, some way ????
November 21st, 2008 at 10:25 am
Nice.
But i still have a problem. I use rhe resourcebundle in my flex app but i’m using nordic letters in some language options, such as å ö ä , they dont show properly. Any hint for this?
January 5th, 2009 at 11:06 am
hello Christophe,
Does the code at your post only available at “flex project” but not “flex library project”? (in flex builder 3).
i have tried you code in a single flex project (name as A), all my locale works well.
but after i create a new flex library project(name as B) ,move locale related from A to it, reference B project at A. i found that only en_US locale works, all other locale just get null via resourceManager.getString(“xyz”, “myKey”);
March 4th, 2009 at 2:55 am
I try write a function like :
private function getString(ps_key:String):String{
return resourceManager.getString(“BaseCard”, ps_key);
}
and set one label to this like :
… mx:FormItem label=”{getString(‘key1′)}” …
but this label is not updated when I change language combobox, any idea ?
Many Thanks,
April 9th, 2009 at 3:15 pm
Is it really not possible to use localization without adding a locale folder in the Flex SDK folder, and add:
en_US
sv_SE
to flex-config.xml?
When working in a big team this seems a bit weird, that everyone has to configure their Flex directory the same way. Isn’t it possible to skip the framework resources, and use the standard locale settings for the framework?
July 7th, 2009 at 5:33 am
Hi all..Here in l10N they defined properties file for each text to be converted.
But i want to apply i18N(internationalization) in my application.
Without specifying the properties file i want to convert the english characters to
any other language characters…do any one have this idea? Please reply me soon.
my email address is vbjain@essar.com…please help…
July 15th, 2009 at 11:57 am
Why not use gettext? A common approach in the opensource world!
See
Creating translation files: code.google.com/p/asgettext/
Reading translation files: code.google.com/p/gettext-for-flash/
for more infors.
August 31st, 2009 at 1:49 pm
#8 Lauri, I know it’s almost a year since you posted :p But still, the problem with å ä ö is that you need to save the file as UTF-8 to work correctly with special characters.
October 14th, 2009 at 11:20 am
Thanks for such a short and working article !!
October 16th, 2009 at 5:39 pm
Thank you very much for the article and zeroing on the key parts of localization!
For those on Mac OSX, to use copylocale, you can open the terminal and enter a command line like “(path to Adobe folder)/Adobe\ Flex\ Builder\ 3/sdks/3.2.0/bin/copylocale en_US fr_FR” where you need to check to see if the full path is correct.
January 5th, 2010 at 9:56 am
Hi..
When i use portuguese language file for localization, all the special characterss are not getting displayed in UI.. for example if i fetch a value called “Início”, the resultant display in UI is “Incio” instead of “Início”.. is there any language specifications in flex?
February 3rd, 2010 at 12:44 pm
Thanks Christophe! Very useful indeed.