Java Reference
In-Depth Information
import com.google.gwt.user.client.ui.ListBox;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.CheckBox;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.event.logical.shared.ValueChangeEvent;
import com.google.gwt.event.logical.shared.ValueChangeHandler;
import com.google.gwt.user.client.ui.HTMLTable;
import com.google.gwt.user.client.Window;
import com.google.gwt.i18n.client.NumberFormat;
import java.util.Date;
Coding Your UI
Now you'll start adding your layout and UI components. We will demonstrate
different techniques for working with your components to provide examples of how
flexible GWT can be. Initialize some of your main components as private class
instance variables:
private VerticalPanel mainPanel = new VerticalPanel();
private AbsolutePanel totalPanel = new AbsolutePanel();
private DockPanel navPanel = new DockPanel();
private HorizontalPanel topPanel = new HorizontalPanel();
private Label totalLabel = new Label("0.00");
private FlexTable flexEntryTable = new FlexTable();
private FlexTable flexCurrentTable = new FlexTable();
private Image logo = new Image();
You'll eventually add sign-in functionality to your timecard, but initially your
application will be displayed as soon as your host page loads in the user's browser.
With this configuration you'll implement your code in the
onModuleLoad
method.
Your first line of code sets the logo for your UI. Create a folder under the
/war/
directory called “images,” and drop in your favorite logo. Next, create a
HorizontalPanel
, set the width to 1000px to provide enough real estate to work
with, and then add your logo, e-mail address, and sign-out link. You'll also need to
align the user information to the right to make things look nice.
logo.setUrl("images/appiriologo.png");
HorizontalPanel userPanel = new HorizontalPanel();
Anchor logOutLink = new Anchor("Sign Out");
Label separator = new Label("|");
102
