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: