Bom galera, aplicações multi-idiomas, parece difícil a primeira vista, porém é fácil desenvolver, O único detalhe é que qualquer texto que aparecerá ao usuário deverá estar no XML, e este XML deverá ser traduzido para todos os idiomas que o sistema será apresentado.
Para que o sistema funcione em multi-idiomas, criei uma classe que carrega o XML e passe todo seu conteúdo para uma variável.
Arquivo Lang.aspublic class Lang { private static var _instance:Lang public static function getInstance():Lang { if(_instance == null) _instance = new Lang return _instance } [Bindable] public var xml:XML; public function getLang(idioma:String):void { var request:URLLoader = new URLLoader(); request.addEventListener(Event.COMPLETE, setLang); request.load(new URLRequest("lang/" + idioma + ".xml")); } public function setLang(e:Event):void { xml = new XML(e.target.data); } }
Veja que a variável XML eu declarei como [Bindable], isto fará que todas as variáveis que possuem referência a ela sejam atualizadas, toda vês que ela for. Esta função recebe inicialmente uma String com valor “pt-BR“, e com isso, carregará o XML em lang/pt-BR.xml. Ao completar o carregamento a função setLang() será invocada, que passará o conteúdo do XML para a variável xml.
No createComplete da aplicação, chamamos o método init() que carrega inicialmente a linguagem pt-BR.
Arquivo main.mxmlprivate function init():void { // inicia em português brasil Lang.getInstance().getLang('pt-BR'); }
Em outros módulos, quando precisamos do arquivo de traduções, apenas o chamamos
Arquivo Sobre.mxml<mx:Label x="10" y="22" text="Eduardo Kraus me" fontSize="15" fontWeight="bold" width="390" textAlign="center"/> <mx:Label x="10" y="45" text="{Lang.getInstance().xml.sobre.versao}" width="390" textAlign="center"/> <mx:Label x="10" y="101" text="{Lang.getInstance().xml.sobre.desenvolvido}" width="390"/> <mx:LinkButton x="141.5" y="71" label="flex.eduardokraus.com" click="navigateToURL(new URLRequest(''))"/>
Veja agora a estrutura do XML da linguagem português.
Arquivo pt-BR.xml<?xml version="1.0"?> <lang> <menu> <menuitem label="Arquivo" > <menuitem label="Abrir" data="abrir" /> <menuitem label="Salvar" data="salvar" /> </menuitem> <menuitem label="Ajuda"> <menuitem label="Sobre" data="sobre" /> </menuitem> </menu> <idiomas> <idioma>es-ES</idioma> <idioma>en-US</idioma> </idiomas> <botao> <texto>Botão</texto> <alerta>Este é um alerta em Português</alerta> </botao> <texto>Texto Simples</texto> <sobre> <titulo>Sobre o sistema do Alemão</titulo> <versao>Versão 1.0</versao> <desenvolvido>Desenvolvido por Eduardo Kraus. Todos os direitos Reservados.</desenvolvido> </sobre> </lang>
Um detalhe interessante que criei neste exemplo foi o menu. Fiz ele totalmente no XML. Na estrutura do XML do menu, tem que seguir a mesma estrutura exigida no livedocs.
Arquivo main.mxml<mx:MenuBar labelField="@label" itemClick="menuPrincipalClicado(event);" dataProvider="{Lang.getInstance().xml.menu.menuitem}"/>
PS: o atributo data não deve ser traduzido, somente deve traduzir o atributo label.
Ao invés de definir um Buttoon e atribuir uma Icon a ele, eu defini uma Image e defini-o como Button. Veja abaixo, definindo buttonMode como “true” ele a imagem se transforma em um botão e definindo useHandCursor como “true”, terá o cursor Hand.
Arquivo main.mxml<mx:Image height="30" click="Lang.getInstance().getLang(String(event.currentTarget.getRepeaterItem()))" source="lang/img/{ rp.currentItem }.png" buttonMode="true"/>
Para mostrar todas as imagens que estão definidos no XML, estou utilizando a classe Repeater, Esta classe repete enquanto há itens vindo do XML. Utilizei mesmo nome para a imagem e a linguagem para facilitar as chamadas.
Veja agora como ficou: