Java Reference
In-Depth Information
Adding Your Styles
When it comes to styling your application, GWT wisely defers to Cascading Style
Sheets (CSS),), which allow you to cleanly separate your application code from your
presentation. You can then offload some of your work and have time to concentrate
on the Java code by handing styling duties over to a designer. Add the following
entries to TimeEntry.css to implement your styles.
.timeEntryTable {
padding-top: 35px;
}
.existingEntryTable {
padding-top: 10px;
}
.separator {
padding-left: 10px;
padding-right: 10px;
}
You can add the class attributes for the styles above by using the addStyleName
property for the various UI components. In the
onModuleLoad
method, you set the
style for your
flex table
by adding the following:
flexEntryTable.setStylePrimaryName("timeEntryTable");
Modifying Your Hosted Page
One last modification before you run your modified application is to insert your new
Root panel identifier. You need to modify TimeEntry.html and use your own HTML
code instead of what is generated by the project wizard. Replace the code in the
hosted page with the following:
<table align="center" width="1000">
<tr>
<td id="timeentryUI"></td>
</tr>
<tr>
<td><img
alt="Powered by Google App Engine" style="padding-top: 20px"/></td>
</tr>
107
