RSS

ASP.NET MVC – Criando uma aplicação multi-idiomas

01 jan

Olá,

Quando “publicamos” uma aplicação ou mais especificamente um site na web, automaticamente o tornamos visíveis ao Mundo e o Mundo pode torna-se instantaneamente usuários de nosso site.

Por este motivo, diversas vezes necessitamos fornecer suporte a diversas línguas dependendo da cultura de nosso usuário. E, para resolver esta questão o .NET nos possibilita a utilização de arquivos de recursos ou resource files (.resx) que podem armazenar traduções de textos ou imagens para serem exibidas na tela.

Para tanto você apenas criaria uma versão local desse arquivo de recurso para a cultura desejada, e, com isso, automaticamente a localização já controlaria como os números, datas e se o texto é lido da direita para a esquerda e vice-versa são exibidos na tela.

 

Entendendo rapidamente o conceito de Cultura ou Culture


Cultura nada mais é do que a combinação do idioma que é falado referente a sua localização geográfica. Isso inclui a forma de exibir as horas, datas e valores monetários. Os exemplo abaixo demonstrar como uma cultura é representada:

en-US – Inglês falado nos Estados Unidos

en-GB – Inglês falado na Inglaterra

en-AU – Inglês falado na Austrália

pt-BR – Português falado no Brasil

 

Entendendo Recursos Globais e Recursos Locais

O .NET nos permite utilizar dois tipos de recursos, os Globais e os Locais:

Recursos Globais: São as informações do seu site como um todo, como por exemplo, o título da página.

Recursos Locais: Se referem ao conteúdo específico de uma página do site.

No ASP.NET MVC isso ocorre da seguinte forma, suas Views serão capazes de referenciar e utilizar os recursos locais, porém, seus Controllers terão acesso apenas aos recursos globais.

Iniciando nossa aplicação

Utilizando Recursos Globais

Vamos criar uma aplicação em ASP.NET MVC e adicionar um pasta de recursos globais, para tanto clique com o botão direto, Add ASP.NET folder e em seguida escolha App_Global_Resources. Dentro do diretório criado vamos adicionar um arquivo de recurso chamado Site.resx, a figura 1.0 demonstra a estrutura do projeto. E adicionaremos o seguinte conteúdo de recurso no arquivo criado conforme a figura 2.0.

Figura 1.0

 

Figura 2.0

Agora, em nosso Controller podemos criar o seguinte método, afim de retornar o valor definido no arquivo de recurso de acordo com o idioma e cultura utilizado:

Neste exemplo criamos um método auxiliar simples, onde facilita o retorno de strings do arquivo de recurso.  Até o momento foi criado apenas um arquivo de recurso, que no caso é o recurso padrão de nossa aplicação, agora vamos criar outro arquivo, porém, este possuirá uma string de cultura juntamente com o nome do mesmo, será chamado de “Site.en-US.resx”.

O intuito é de manter neste arquivo as mesmas chaves criadas no arquivo anterior, porém com a tradução para o Inglês falado nos EUA. A figura 3.0 demonstra o arquivo e a estrutura do projeto:

Figura 3.0

Neste momento, basta alterarmos nosso arquivo Web.config para que nossa aplicação multi-idioma funcione, para isso inclua o seguinte bloco em seu Web.config:

<system.web>

<globalization enableClientBasedCulture=”true” uiCulture=”auto”/>

</system.web>

Agora se executarmos nossa aplicação note que o idioma utilizado é o padrão (pt-BR). Isso ocorre pois nosso navegador esta configurado com esse idioma como padrão.  As figuras 4.0 e 5.0 ilustram o caso:

 

Figura 4.0

 

Figura 5.0

 

Note que, se alterarmos o idioma padrão para o “Inglês (Estados Unidos) [en-US]” salvar e recarregar a página, a mesma será carregada utilizando o arquivo de recurso referente ao idioma padrão de nosso Browser.

Porém é muito comum permitir que o usuário escolha qual a língua/cultura deseja utilizar no site, independente do idioma do Browser. Para tanto basta modificar o método criado no Controller para que fique da seguinte forma:

Note agora que, nossa página é carregada de acordo com a cultura definida pelo Controller na variável cultura. Se a alterarmos para “en-US” a página será carregada com a mesma cultura independente do idioma padrão do Browser.

 

Utilizando Recursos Locais

Como os recursos locais são utilizados pelas Views, no diretório que a View esta mantida vamos criar um diretório de recursos locais, para tanto clique com o botão direto, Add ASP.NET folder e em seguida escolha App_Local_Resources. Dentro do mesmo vamos criar um arquivo de recurso com o mesmo nome de nossa View que irá utilizá-lo e um segundo arquivo para a tradução em inglês.

A figura 6.0 demonstra os arquivos criados e a estrutura de nosso projeto:

 

Figura 6.0

Agora nossa View já pode utilizar os recursos disponíveis, veja abaixo como utilizar os recursos da View Index:

 

Neste artigo podemos entender o conceito de Localização do ASP.NET e aplicá-lo a uma aplicação ASP.NET MVC com suporte a multi-idiomas.

 

Baixe nosso projeto de exemplo aqui.

 

Até o próximo.

 

Anúncios
 
7 Comentários

Publicado por em 01/01/2011 em ASP.NET, ASP.NET MVC

 

Tags: , ,

7 Respostas para “ASP.NET MVC – Criando uma aplicação multi-idiomas

  1. Marcelo

    14/03/2011 at 5:31 am

    O link para download está quebrado, pode corrigir?

     
    • Rafael Zaccanini

      14/03/2011 at 7:38 pm

      Olá Marcelo,

      Na verdade não está quebrado, o 4shared.com que é onde fiz o upload estava com problemas.

      O mesmo já está disponível novamente! Obrigado.

       
  2. Rubens

    08/11/2011 at 5:27 pm

    Esta de parabéns hein campeão! Obrigado.

     
  3. Kiyoshi

    09/12/2011 at 5:29 pm

    Marcelo,

    Na minha solução, tenho mais de um projeto; existe alguma forma de compartilhar um arquivo de recurso em vários projetos sem a necessidade de ficar replicando em todos os projetos?

     
    • Rafael Zaccanini

      19/12/2011 at 1:19 pm

      Olá Mareclo,

      Você tem mais que um projeto de apresentação ? Neste caso nunca realizei com mais de um, acredito ser possível, porém ainda não tentei realizar algo do tipo !

      Abs.

       

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s

 
%d blogueiros gostam disto: