Le multilingue en Flex

written by netinfluence 26 octobre 2009
Le multilingue en Flex

Flex a tout ce qu’il faut pour gérer le multilingue de manière très simple et efficace. Mais cela demande tout de même à être mis en place puisque quelques subtilités existent.

Tout d’abord, vérifiez que vous avez les locales nécessaires au niveau du sdk (/Adobe Flex Builder 3/sdks/3.2.0/frameworks/locale/). Pour chaque locale, vous devez avoir un répertoire correspondant (par exemple en_US ou fr_FR). S’il vous en manque un, il suffit simplement de copier un des répertoires existants et de le renommer.

Pour commencer, il nous faut un fichier par langue pour y mettre les traductions nécessaires. Pour cela, il suffit de créer un répertoire locale/ dans votre répertoire src/ :

Dans ce répertoire locale/ vous devrez ensuite créer un répertoire pour chaque langue que vous voulez traduire (ici l’allemand et le français). Enfin, chaque répertoire doit contenir le fichier de traduction qu’on appellera ici « monProjet.properties ».

Les fichiers .properties contiennent une ligne par traduction selon le format de l’exemple ci dessous :

L_LOGIN=identifiant
L_PASSWORD=mot de passe
L_EXIT=quitter

J’ai l’habitude (pour des raisons historiques 😉 ) d’écrire mes clés de traduction en majuscule et de les faire commencer par un « L_ » mais ce n’est pas une obligation.

Maintenant que nous avons nos fichiers de traductions, il faut dire à l’application qu’ils existent. Pour cela, il suffit de rajouter au fichier monProjet.mxml les quelques lignes suivantes :

    <mx:Metadata>
        [ResourceBundle("monProjet")]
    </mx:Metadata>

Maintenant, chaque fois que vous voudrez traduire un texte, il faudra l’intégrer de la manière suivante à votre code :

    resourceManager.getString('monProjet', 'L_LOGIN');

Reste encore à préciser à votre application quelle est la langue actuellement sélectionnée. Rien de plus simple. La commande ci-dessous permet justement d’indiquer la langue choisie (quelle chance !) :

    resourceManager.localeChain = ['fr_FR'];

Evidemment, pour l’allemand, ça aurait donné :

    resourceManager.localeChain = ['de_DE'];

Une dernier petit détail… la compilation. En effet, lors de la compilation de votre projet, il faut préciser les langues utilisées et l’endroit où se trouvent les fichiers de traduction. Pour cela, dans les propriétés de votre projet, une section (« Flex Compiler ») traite de la compilation. Vous pouvez alors donner des arguments supplémentaires au compilateur. Pour la gestion multilingue, nous allons ajouter ceux-ci :

-locale=fr_FR,de_DE -allow-source-path-overlap=true -source-path=locale/{locale}

Cette fois le tour est joué, votre application est polyglotte.

Voici un très petit exemple qui permet de rapidement tester la fonctionalité :

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute"
    creationComplete="init()">
    <mx:Metadata>
        [ResourceBundle("monProjet")]
    </mx:Metadata>
    <mx:Script>
        <![CDATA[
            private function init():void {
                resourceManager.localeChain = ['fr_FR'];
            }
        ]]>
    </mx:Script>
    <mx:Label text="FR" x="10" y="10"
              click="{resourceManager.localeChain = ['fr_FR']}"/>
    <mx:Label text="DE" x="10" y="30"
              click="{resourceManager.localeChain = ['de_DE']}"/>
    <mx:Label x="50" y="20"
              text="{resourceManager.getString('monProjet', 'L_HELLO')}"/>
</mx:WindowedApplication>

You may also like

4 comments

jérôme chesne 28 novembre 2009 at 17 h 44 min

Merci, tuto clair simple et précis.

Reply
Lucas Marguet 30 novembre 2009 at 1 h 27 min

Enfin un tutoriel simple et efficace. Merci beaucoup !

Reply
jérôme chesne 30 novembre 2009 at 22 h 51 min

Re bonjour ! Juste une petite question.

Comment dire que mon fichiers properties est à l’exterieur de mon projet. Je souhaite pouvoir modifier mon fichier de langue sans avoir à recompiler l’application.

Reply
Julien 26 décembre 2009 at 18 h 24 min

Salut Jérôme,

Je n’ai personnellement jamais eu l’occasion d’utiliser cette fonctionnalité de Flex, mais il est possible en effet d’externaliser les ressources de localisation sous forme de module. Ceci dit, a priori, ces « resource modules » doivent eux mêmes être compilés, donc il ne s’agit pas simplement de modifier son fichier properties. Mais ceci peut éventuellement être plus simple que de recompiler l’application complète.

Tu trouveras un article à ce sujet ici : http://livedocs.adobe.com/flex/3/html/help.html?content=l10n_3.html .

A+

Reply

Leave a Comment