GWT layout puzzled

Question

I am struggling to understand the strange behavior of the GWT layout panels. I am wondering how GWT translates Layout logic into javascript and html. sometimes we don’t get the expected layout. something under the cover is done by the GWT compiler. The GWT documentation is not clear enough how the layout is done under the cover. are there any good books or tutorials that well explain the problems of GWT layout?

thanks.

Answer 1

I do not know about good books or textbooks, but here is some information that may be useful.

First, as you may know, there is a big difference between FooPanels and FooLayoutPanels. These are two different sets of panels that are based on different layout mechanisms. Layout panels are new material that seems to be better suited for layouts that have hard-coded sizes, the Google Wave style. Older FooPanels (VerticalPanel, etc.) are based mainly on HTML tables.

FlowPanel is just what displays your widgets as consecutive HTML elements in one DIV. As described in the document: "A panel that formats child widgets using the default HTML behavior."

DockLayoutPanel - viewing the code shows that it hardcodes the sizes of different regions according to what you specify in children (north, east, etc.).

Finally, my experience led me to abandon the use of the Layout Panel system and rely only on HTML and CSS wherever possible. This means using HTMLPanel + UiBinder mainly, and sometimes FlowPanel, rarely also some of the other panels.

Trying to figure out and fight the layout bar system to do things that aren't the “default case” was a waste of time. I am not saying that this is the best thing to do, but I just could not get the control that I would like without it, especially with regard to elements that should automatically expand vertically. If you haven’t already done so, check out the GWT Dashboard documentation:

The panels described above are best used to determine the external structure of the application, that is, those parts that are least “document-like”. You should continue to use the basic widgets and HTML structure for those parts for which the HTML / CSS layout algorithm works well. In particular, consider using UiBinder templates to directly use HTML wherever it makes sense.