10.11.2010

GWT Internationalisation Checklist

Follow these steps to internationalize you GWT app and show the language corresponding to the locale the browser sent:


Turn your welcome page to a dynamic jsp by changing your web.xml

  <welcome-file-list>
    <welcome-file>
      your-welcome-file.jsp
    </welcome-file>
  </welcome-file-list>

So rename your welcome page, presumably .html, to .jsp. In the welcome page header, add:

    <meta name="gwt:property" 
      content="locale=<%= request.getLocale() %>">

Now add I18N to your app by adding the following line to your *.gwt.xml:

  <inherits name='com.google.gwt.i18n.I18N'/>

For each locale you want to provide, add another line like these:

  <extend-property name="locale" values="en_US"/>
  <extend-property name="locale" values="de_DE"/>

Now the GWT-App delivered to the client is configured to use the locale sent by her browser.
Next, create an interface extending Messages, e.g.:

public interface Text extends Messages {
public static final Text LANG = 
          GWT.create(Text.class);

String welcome(String name);
}

Now you can externalize your static String. For example, substitute
new Label("Hello "+name);

with
new Label(Text.LANG.welcome(name));

The GWT-magic, on GWT.create provides you with an implementation of your interface that is bound to i18n-property files. So create a File Text.properties in the package of the interface:

  welcome = Hello {0}

You are free to add more resources by providing more methods in your interface and the corresponding line in the properties file. If you want a, say, german translation, create Text_de_DE.properties:

  welcome = Guten Tag {0}

Voilà!

Of course, there are a lot more options in GWT I18N, like setting locales explicitely or use constant string and the like. Therefore do not miss the original documentation.