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

Abrindo PDF dentro de sua aplicação Swing (Exemplo tela de ajuda)