Changing locales at run time with the ResourceManager - with test case and screenshot

Question

I'm trying to add more locales to a Flex mobile app and have prepared a simple test case to demonstrate the problem I have currently:

Screenshot:

TestLang.mxml (just add to a blank project in Flash Builder 4.7):

<?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" 
               initialize="init()">

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

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import spark.events.IndexChangeEvent;

            [Bindable]
            private var _locales:ArrayCollection = new ArrayCollection();

            [Bindable]
            private var _numbers:ArrayCollection = new ArrayCollection();

            private function init():void {
                resourceManager.localeChain = [ 'de_DE' ];

                _locales.addItem({ locale: 'en_US', label: 'English' });
                _locales.addItem({ locale: 'ru_RU', label: 'Русский' });
                _locales.addItem({ locale: 'de_DE', label: 'Deutsch' });

                localize();
            }

            private function localize():void {
                _numbers.removeAll();
                _numbers.addItem({ label: resourceManager.getString('resources', 'menu.one') });
                _numbers.addItem({ label: resourceManager.getString('resources', 'menu.two') });
                _numbers.addItem({ label: resourceManager.getString('resources', 'menu.three') });
                _numbers.addItem({ label: resourceManager.getString('resources', 'menu.four') });
                _numbers.addItem({ label: resourceManager.getString('resources', 'menu.five') });
            }

            protected function changeLocale(event:IndexChangeEvent):void {
                var list:List = event.target as List;
                var item:Object = list.selectedItem;
                resourceManager.localeChain = [ item.str ]; // XXX
                localize();
            }

        ]]>
    </fx:Script> 

    <s:layout>
        <s:VerticalLayout />
    </s:layout>

    <s:List 
        width="100%" 
        height="50%"
        change="changeLocale(event)"
        dataProvider="{_locales}">
        <s:itemRenderer>
            <fx:Component>
                <s:IconItemRenderer labelField="label" />
            </fx:Component>
        </s:itemRenderer>
    </s:List>

    <s:List 
        width="100%" 
        height="50%"
        dataProvider="{_numbers}">
        <s:itemRenderer>
            <fx:Component>
                <s:IconItemRenderer labelField="label" />
            </fx:Component>
        </s:itemRenderer>
    </s:List>

</s:Application>

src/locale/en_US/resource.properties:

menu.one=One
menu.two=Two
menu.three=Three
menu.four=Four
menu.five=Five
menu.title=English

src/locale/de_DE/resource.properties:

menu.one=Eins
menu.two=Zwei
menu.three=Drei
menu.four=Vier
menu.five=Fünf
menu.title=Deutsch

src/locale/ru_RU/resource.properties:

menu.one=Один
menu.two=Два
menu.three=Три
menu.four=Четыре
menu.five=Пять
menu.title=Русский

In the project properties I have added Flex Build Path -> Source path of src\locale\{locale}

And the Flex Compiler arguments of -locale de_DE ru_RU en_US -allow-source-path-overlap=true

In the screenshot above you can see that the german locale is shown properly initially.

But when you touch the upper List to change the locale, then the lower List becomes empty.

Why does it happen please?

I have read the Adobe doc Changing locales at run time with the ResourceManager and few others, but couldn't figure out the cause yet.

When resourceManager.localeChain is assigned a new array, does the locale switch happen synchronously or should I maybe listen for some event?

Answer 1

I had a copy-paste error! The correct line would be

resourceManager.localeChain = [ item.locale ];

I've decided to keep my question and this answer in case someone is looking for a simple test case of switching Flex locales during runtime.