Question

I need to implement a DockLayoutPanel in UiBinder. I knew that we can use < g:north> < g:west> and so on in UiBinder to do the same thing as what DockLayoutPanel.addNorth(), DockLayoutPanel.addWest() do.

My question is that, is there anything in Uibinder, which can do the same thing as DockLayoutPanel.insertNorth(), DockLayoutPanel.insertWest()?

Also, are there any official documents that I can search the Uibinder commands so that I can know what I can use for uibinder?

Thanks.

Answer 1

Both add*() and insert*() methods of the DockLayoutPanel are for programmatic runtime addition of sub-panels. UiBinder doesn’t do “the same thing” as those methods. Your work directly with UiBinder happens during design time only.

UiBinder is a static layout tool, a “snapshot” of your widget immediately after initialization, a way to describe what the positioning of elements relative to each other is at first.

The widgets you specify using UiBinder can be programmatically manipulated after initialization. Suppose you’ve specified the following layout:

 <g:DockLayoutPanel ui:field="myDockPanel">
    <g:north size="100">
        <g:Label ui:field="northernLabel">I am far north</g:Label>
    </g:north>
    <g:center>
        <g:Label ui:field="centerLabel">Center Stage</g:Label>
    </g:center>
</g:DockLayoutPanel>

In the code running after your view initializes you can now go:

myDockPanel.insertNorth(new Label("I am even farther north!"), 100.0, northernLabel);

Also, are there any official documents that I can search the Uibinder
commands so that I can know what I can use for uibinder?

Google Dev Guide section on declarative layout with UiBinder is as official as you can get, AFAIK.