Marcos Junior

Meu amigo Caio postou em seu blog uma boa dica para trabalhar com idiomas no Flex, resolvi dar uma filtrada e compartilhar aqui no blog. Primeiramente vou explicar como traduzir e fazer o controle de idiomas dos componentes do Flex, e em seguida explicarei como controlar idiomas dos textos de sua aplicação.

Traduzindo os componentes do Flex

Você pode traduzir os componentes do Flex de duas maneiras: 1°

- Baixe aqui o framework ( e rpc ) já traduzido (pt_BR) pela própria Adobe;
- Descompacte o arquivo na pasta C:Arquivo de ProgramasAdobeFlex Builder 3sdks3.2.0frameworkslocale;
- Acesse as propriedades do projeto, clique em “Flex Compiler”, em “Aditional compiler arguments” altere o argumento -locale para pt_BR

Pronto, os componentes do Flex estarão traduzidos para o português do brasil.

2°

Este método é para aqueles que queiram criar ou alterar traduções.

Abra o prompt de comando, e navegue até a pasta C:Arquivos de ProgramasAdobeFlex Builder 3sdks3.2.0bin; Digite o comando:

1

copylocale.exe en_US pt_BR

Isto irá criar os arquivos necessários para fazer a tradução ou alteração. Para ver-los, acesse a pasta C:Arquivos de ProgramasAdobeFlex Builder 3sdks3.2.0frameworkslocalept_BR.

Serão criados 4 arquivos com a extenção .swc, dentro desses arquivos contem uma pasta chamada locale, e nesta pasta, arquivos com a extenção .properties, os quais o conteúdo é a tradução em modo key=value.

Para visualizar e alterar esses arquivos .properties, abra o arquivo .swc correspondente usando o WinRAR.

Aqui você encontra as traduções do framework feitas pela própria adobe, e aqui vc encontra as traduções do rpc.

É só baixar os arquivos .properties e substituir os do .swc, feito isso, acesse as propriedades do projeto, clique em “Flex Compiler”, em “Aditional compiler arguments” altere o argumento -locale para pt_BR.

Pronto, os componentes do Flex ja foram traduzidos, agora, vamos criar um exemplo de como fazer traduzir os textos de sua aplicação.

Traduzindo sua aplicação e criando um controle de idiomas.

Crie uma nova aplicação, e na raiz do seu projeto cria uma pasta chamada locale, dentro desta pasta crie mais duas pastas: pt_BR e en_US.

Dentro das pastas pt_BR e en_US, você irá criar um arquivo chamado Application.properties com o seguinte conteúdo para cada um deles:

No arquivo Application.properties da pasta en_US:

aplicacao.nome=Hello Word!!

No arquivo Application.properties da pasta pt_BR:

aplicacao.nome=Olá Mundo!!

Atenção: É necessário que o arquivo esteja como UTF-8, caso não saiba como tornar seu arquivo UTF-8, clique nele com o botão direito ( no Flex Builder ), em “Text file encoding” clique em “Other” e selecione UTF-8.

Acesse as propriedade do seu projeto, clique em “Flex Compiler”, em “Aditional compiler arguments” altere o argumento -locale pt_BR para -locale=en_US,pt_BR e logo após adicione o seguinte argumento: -source-path=../locale/{locale}

Pronto. Agora, copie o código abaixo em sua aplicação para testar.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

<?xml version="1.0" encoding="UTF-8"?>
<mx:Application  xmlns:mx="http://www.adobe.com/2006/mxml"  layout="absolute" xmlns:ns1="*">
 
    <mx:Metadata>
    	[ResourceBundle("Application")] //Nome do arquivo .properties
    </mx:Metadata>
 
    <mx:Script>
    <![CDATA[
 
        [Bindable]
        private var Locais:Array = [ "en_US" , "pt_BR" ];
 
        private function IniciarCombo(event:Event):void
        {
            /*A ordem nessa array é dada conforma o que foi colocado no 
            Flex Compiler > additional compiler arguments*/
            cboLocais.selectedIndex = Locais.indexOf(resourceManager.localeChain[0]);
        }
 
        private function AlterarLocal(event:Event):void
        {
            // Seta o Local que será usado
            // "en_US" ou "pt_BR "
            resourceManager.localeChain = [ cboLocais.selectedItem ];
        }
    ]]>
    </mx:Script>
 
    <mx:Label text="{resourceManager.getString('Application', 'aplicacao.nome')}" fontSize="48" x="10" y="40"/>
 
    <mx:ComboBox id="cboLocais" dataProvider="{Locais}"
                 initialize="IniciarCombo(event)"
                 change="AlterarLocal(event)" x="10" y="10"/>
 
    <mx:DateChooser x="10" y="113"/>
 
</mx:Application>

Clique aqui para visualizar o exemplo deste post.
Clique aqui para baixar os arquivos deste post.

Bom, é isso ae… Qualquer duvida deixe comentários.

UPDATE 14/01/2009: Na TV Adobe achei um screencast que explica exatamente tudo isso que postei no blog, só que em vídeo, vale a pena dar uma olhada ( em Inglês ). (http://tv.adobe.com/#vi+f1472v1032)

Abraços

Be Sociable, Share!

•