Aplicação Flex MULTI linguagem com XML




E ai galera! Seguinte, apareceu uma demanda na empresa qual trabalho para internacionaizar a aplicação flex através de XML. Dei umas estudadas e efetuei alguns testes de como fazer, com isso cheguei em um resultado positivo que passo agora um exemplo à vocês !

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.as
 

 

public 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.mxml
 
 
private 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="teste"
               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>teste Bruno. </desenvolvido>
    </sobre>
</lang>

Menu

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.

Botões para trocar as linguagens

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.

É isso ai :p

Comentários

Postagens mais visitadas deste blog

Algorítimo Para Validar Cpf Segundo Receita Federal em Java

Executar Audio em Java Swing

Gerenciamento de projetos: Introdução, Experiência e Estudo - Parte I