GXT 3.1 Border Layout Container with Horizontal Box Container Layout Example

BlcExample_HBoxContainerLayout.java

import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Widget;
import com.sencha.gxt.core.client.util.Margins;
import com.sencha.gxt.widget.core.client.container.BorderLayoutContainer;
import com.sencha.gxt.widget.core.client.container.BorderLayoutContainer.BorderLayoutData;
import com.sencha.gxt.widget.core.client.container.BoxLayoutContainer.BoxLayoutData;
import com.sencha.gxt.widget.core.client.container.HBoxLayoutContainer;
import com.sencha.gxt.widget.core.client.container.HBoxLayoutContainer.HBoxLayoutAlign;
import com.sencha.gxt.widget.core.client.container.MarginData;
import com.sencha.gxt.widget.core.client.container.SimpleContainer;
import com.sencha.gxt.widget.core.client.container.Viewport;

public class BlcExample_HBoxContainerLayout {

  public BlcExample_HBoxContainerLayout() {
    Viewport root = new Viewport();
    RootPanel.get().add(root);
    root.add(getMain());
  }

  private Widget getMain() {
    BorderLayoutData layoutDataNorth = new BorderLayoutData(100);
    BorderLayoutData layoutDataWest = new BorderLayoutData(150);
    BorderLayoutData layoutDataSouth = new BorderLayoutData(100);

    layoutDataNorth.setMargins(new Margins(10));
    layoutDataWest.setMargins(new Margins(10));
    layoutDataSouth.setMargins(new Margins(10));

    MarginData layoutDataCenter = new MarginData(10);

    BorderLayoutContainer main = new BorderLayoutContainer();
    main.setNorthWidget(getNorthWidget(), layoutDataNorth);
    main.setWestWidget(getWestWidget(), layoutDataWest);
    main.setSouthWidget(getSouthWidget(), layoutDataSouth);
    main.setCenterWidget(getCenterWidget(), layoutDataCenter);

    return main;
  }

  public Widget getNorthWidget() {
    SimpleContainer w = new SimpleContainer();
    w.setBorders(true);
    w.getElement().getStyle().setBackgroundColor("#FFF");
    w.add(getNorthWidgets());
    return w;
  }

  private Widget getNorthWidgets() {
    SimpleContainer logo = new SimpleContainer();
    logo.add(new HTML("Logo"));
    logo.setBorders(true);

    SimpleContainer spacer = new SimpleContainer();
    //spacer.setBorders(true);

    SimpleContainer controls = new SimpleContainer();
    controls.setBorders(true);
    controls.add(new HTML("<a href=\"#\">Login</a>"));

    BoxLayoutData layoutDataLogo = new BoxLayoutData(new Margins(10));
    BoxLayoutData layoutDataSpacer = new BoxLayoutData(new Margins(10));
    layoutDataSpacer.setFlex(1);
    BoxLayoutData layoutDataControls = new BoxLayoutData(new Margins(10));
    
    HBoxLayoutContainer hlc = new HBoxLayoutContainer(HBoxLayoutAlign.MIDDLE);
    //hlc.setPadding(new Padding(10));
    hlc.add(logo, layoutDataLogo);
    hlc.add(spacer, layoutDataSpacer);
    hlc.add(controls, layoutDataControls);

    return hlc;
  }

  public Widget getWestWidget() {
    SimpleContainer w = new SimpleContainer();
    w.setBorders(true);
    w.getElement().getStyle().setBackgroundColor("#FFF");
    return w;
  }

  public Widget getSouthWidget() {
    SimpleContainer w = new SimpleContainer();
    w.setBorders(true);
    w.getElement().getStyle().setBackgroundColor("#FFF");
    return w;
  }

  public Widget getCenterWidget() {
    SimpleContainer w = new SimpleContainer();
    w.setBorders(true);
    w.getElement().getStyle().setBackgroundColor("#FFF");
    return w;
  }

}

Congrats!!! Helped me a lot!