Creating a user interface

In the File menu, select New > UiBinder.
Input "tutorial.client" in the "Package" text field.
Input "Main" in the "Name" text field.
Click the "Finish" button.
"src/tutorial.client/Main.java" and "src/tutorial.client/Main.ui.xml" will be created as follows:

Main.java

package tutorial.client;

import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Widget;

public class Main extends Composite {

    private static MainUiBinder uiBinder = GWT.create(MainUiBinder.class);

    interface MainUiBinder extends UiBinder<Widget, Main> {
    }

    public Main() {
        initWidget(uiBinder.createAndBindUi(this));
    }

}

Main.ui.xml

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
    xmlns:g="urn:import:com.google.gwt.user.client.ui">
    <ui:style>
       
    </ui:style>
    <g:HTMLPanel>
    </g:HTMLPanel>
</ui:UiBinder>

Edit Main.ui.xml as follows:

Main.ui.xml

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
    xmlns:g="urn:import:com.google.gwt.user.client.ui">
    <ui:style>
       
    </ui:style>
    <g:HTMLPanel>
        What's happening?<br />
    <g:TextArea ui:field="content"></g:TextArea><br />
    <g:Button ui:field="tweet">Tweet</g:Button>

    </g:HTMLPanel>
</ui:UiBinder>

Edit MainEntryPoint.java as follows:

MainEntryPoint.java

package tutorial.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;

public class MainEntryPoint implements EntryPoint {

    public void onModuleLoad() {
        RootPanel.get().add(new Main());
    }
}


Reload your blowser. The following page will be shown:


Next...

Continue to Creating a model.
 
Comments