Internationalization in GWT

Hi All,

Today I am going to post how to do internationalization using GWT in a simple way.

Please refer to the help guide of gwt if you need about locale..PLease check here : http://code.google.com/webtoolkit/doc/latest/DevGuideI18n.html

I have used  static String Internationalization and  I have extended Constant Interface.

I have described the process in steps.
 Step1:

In gwt.xml  inhereit the below values
    inherits name="com.google.gwt.i18n.I18N"
    extend-property name="locale" values="en"
   extend-property name="locale" values="sp"
   extend-property name="locale" values="fr"    
   
     

Step2:  Create  properties files in the client folder:

    MyMessages_en.properties
    MyMessages_fr.properties
    MyMessages_sp.properties
    MyMessages_ja.properties 

Note: _en etc are the language code for the locale.

    Don't forget this meta tag in the main html file:
    meta name="gwt:property" content="locale=en"

meta http-equiv="content-type" content="text/html;charset=utf-8"

You must also ensure that all relevant source and .properties files are 

set to be in the UTF-8 charset in your IDE. 

Step 2: create a entry point

public class Test implements EntryPoint {
   
    MyMessages myMessages = (MyMessages) GWT.create(MyMessages.class);

    public void onModuleLoad() {

        Label enlbl = new Label(myMessages.add());
        Label splbl = new Label(myMessages.stockWatcher());

        final ListBox lbox = new ListBox();
        lbox.addItem("en");
        lbox.addItem("fr");
        lbox.addItem("sp");
        lbox.addItem("ja");
        lbox.addChangeHandler(new ChangeHandler() {

            public void onChange(ChangeEvent event) {
                if (lbox.getSelectedIndex()==0) {
                    changeLocale("en");
                }else if (lbox.getSelectedIndex() == 1) {
                    changeLocale("fr");
                } else if (lbox.getSelectedIndex() == 2) {
                    changeLocale("sp");
                } else if (lbox.getSelectedIndex() == 3) {
                    changeLocale("ja");
                }
               
            }

        });
        RootPanel.get().add(enlbl, 10, 0);
        RootPanel.get().add(splbl, 60, 0);
        RootPanel.get().add(lbox,100,20);

    }
In the Module load please note the red line
Reason:Because these are interfaces, not classes, you can't instantiate them directly. Instead, you use the GWT.create(Class) method. Then you'll be able to use these interfaces' accessor methods to retrieve the appropriate strings.
to get and set the locale to load the url please use the following JSNI code


private native void changeLocale(String newLocale)/*-{
            var currLocation = $wnd.location.toString();
            var locArray = currLocation.split("?");
            $wnd.location.href = locArray[0]+"?locale="+newLocale;
        }-*/;

Create a new interface

import com.google.gwt.i18n.client.Constants;

public interface MyMessages extends Constants {
     @DefaultStringValue("StockWatcher")
      String stockWatcher();

      @DefaultStringValue("Symbol")
      String symbol();

      @DefaultStringValue("Price")
      String price();

      @DefaultStringValue("Change")
      String change();

      @DefaultStringValue("Remove")
      String remove();

      @DefaultStringValue("Add")
      String add();
    }

thats it, whenver you select a locale from the listbox the page load with the selected locale. thats all.

I refered to http://code.google.com/webtoolkit/doc/latest/tutorial/i18n.html for this workout.

Please download the complete eclipse source code here

If you find any mistakes please comment here to correct it.

Cheers,
Venkat