StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>It looks like your are using GXT. This is a very important information because GXT layout uses other classes than native GWT layout.</p> <p>Take a look a the Sencha Showcase:</p> <p><a href="http://www.sencha.com/examples/#ExamplePlace:borderlayout" rel="nofollow">http://www.sencha.com/examples/#ExamplePlace:borderlayout</a></p> <p>The BorderLayout example shows how to create a border layout.</p> <p>First create a BorderLayoutContainer:</p> <pre><code>final BorderLayoutContainer con = new BorderLayoutContainer(); con.setBorders(true); </code></pre> <p>Then create panels for the areas you like to have:</p> <pre><code>ContentPanel north = new ContentPanel(); ContentPanel west = new ContentPanel(); ContentPanel center = new ContentPanel(); center.setHeadingText("BorderLayout Example"); center.setResize(false); center.add(new Label("center")); ContentPanel east = new ContentPanel(); ContentPanel south = new ContentPanel(); </code></pre> <p>After creating the ContentPanels define the BorderLAyoutData for each ContentPanel:</p> <pre><code>BorderLayoutData northData = new BorderLayoutData(100); northData.setMargins(new Margins(5)); northData.setCollapsible(true); northData.setSplit(true); BorderLayoutData westData = new BorderLayoutData(150); westData.setCollapsible(true); westData.setSplit(true); westData.setCollapseMini(true); westData.setMargins(new Margins(0, 5, 0, 5)); MarginData centerData = new MarginData(); BorderLayoutData eastData = new BorderLayoutData(150); eastData.setMargins(new Margins(0, 5, 0, 5)); eastData.setCollapsible(true); eastData.setSplit(true); BorderLayoutData southData = new BorderLayoutData(100); southData.setMargins(new Margins(5)); southData.setCollapsible(true); southData.setCollapseMini(true); </code></pre> <p>After you have defined the layouts, just add your widgets to the BorderLAyoutContainer:</p> <pre><code>con.setNorthWidget(north, northData); con.setWestWidget(west, westData); con.setCenterWidget(center, centerData); con.setEastWidget(east, eastData); con.setSouthWidget(south, southData); </code></pre> <p>Finally, add the BorderLAyoutContainer to the viewPort:</p> <pre><code>viewport.add(con); </code></pre> <p>To put your widget on the right most side, use:</p> <pre><code>con.setEastWidget(widget, eastData); </code></pre> <p>Hope that helps.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload