Java Reference
In-Depth Information
Add a final HorizontalPanel to hold the grand total for the timecard that will appear
at the bottom of the UI under the FlexTable .
// set up a horizontal panel to hold the grand total
totalPanel.setSize("1000px","50px");
totalPanel.add(new Label("Total:"), 900, 25);
totalPanel.add(totalLabel, 950, 25);
Now you'll start setting up your FlexPanel that will consist of the main UI component
for your application. First, you set the width of the table to expand the entire width of
your tabbed interface, and then you add all of your columns and headers.
// set the width of the table to expand the size of the navPanel
flexEntryTable.setWidth("100%");
// set the style for the table to be accessed in the css
flexEntryTable.setStylePrimaryName("timeEntryTable");
// add the columns and headers
flexEntryTable.setText(0, 0, "Project");
flexEntryTable.setText(0, 1, "Milestone");
flexEntryTable.setText(0, 2, "Billable?");
flexEntryTable.setText(0, 3, "Mon");
flexEntryTable.setText(0, 4, "Tue");
flexEntryTable.setText(0, 5, "Wed");
flexEntryTable.setText(0, 6, "Thu");
flexEntryTable.setText(0, 7, "Fri");
flexEntryTable.setText(0, 8, "Sat");
flexEntryTable.setText(0, 9, "Sun");
flexEntryTable.setText(0, 10, "Total");
Now you need to add all of the relevant UI components to your tabbed interface.
Create a new VerticalPanel to hold the date picker, buttons, FlexTable, and grand
total, and add this new panel to the first tab. Add your tabbed panel, set the width,
and enable animation. Add your UI to the first tab. You'll set some properties of your
tabbed interface and make sure the first tab is the one that your users see by default
when your application loads. You'll be adding more tabs to your panel later on.
VerticalPanel tab1Content = new VerticalPanel();
tab1Content.add(navPanel);
tab1Content.add(flexEntryTable);
tab1Content.add(totalPanel);
104
 
Search WWH ::




Custom Search