View Full Version : Buttonbar outside FramedPanel

18 Nov 2015, 10:11 AM
Hi all,
I'm using gxt 3.1.4 and gwt 2.6.1.
Hi have this simple example with a tabPanel with two tabs. Each tab holds an instance of FramedPanel which holds only a buttonBar with two buttons.
The first tab presents the FramedPanel as expected, but when I select the second tab the FramedPanel has the buttonbar outside of its area.

Here is the code:

public class SimpleGxtTest implements EntryPoint, IsWidget {

private VerticalPanel widget;

* This is the entry point method.
public void onModuleLoad() {

/* (non-Javadoc)
* @see com.google.gwt.user.client.ui.IsWidget#asWidget()
public Widget asWidget() {
if (widget == null) {

SelectionHandler<Widget> handler = new SelectionHandler<Widget>() {
public void onSelection(SelectionEvent<Widget> event) {
TabPanel panel = (TabPanel) event.getSource();
Widget w = event.getSelectedItem();
TabItemConfig config = panel.getConfig(w);
Info.display("Message", "'" + config.getText() + "' Selected");


final PlainTabPanel tabPanel = new PlainTabPanel();
tabPanel.setPixelSize(450, -1);
tabPanel.add(createTabItem(), "First");
tabPanel.add(createTabItem(), "Second");

widget = new VerticalPanel();

return widget;

// private Widget createTabItem() {
// VerticalLayoutContainer tabItem = new VerticalLayoutContainer();
// tabItem.add(createFramedPanel(), new VerticalLayoutData(1, -1, new Margins(10, 10, 0, 10)));
// tabItem.add(new HTML("<p>&nbsp;</p>"));
// return tabItem;
// }

private Widget createTabItem() {
VBoxLayoutContainer tabItem = new VBoxLayoutContainer();
tabItem.add(createFramedPanel(), new BoxLayoutData(new Margins(5, 10, 5, 10)));
return tabItem;

private Widget createFramedPanel() {
* the framed panel single body widget: a form; inside of which lays a single body widget: <i>formBodyContainer</i>
FormPanel form = new FormPanel();

* form body container (vertical layout container), inside of which any form fields will be added
VerticalLayoutContainer formBodyContainer = new VerticalLayoutContainer();

* The framed Panel
FramedPanel framedPanel = new FramedPanel();

framedPanel.setPixelSize(400, 200);

//formBodyContainer will be the single body widget for the form
//Note: we're not using the functional-equivalent setWidget() method
//only because add() method has LayoutData as parameter
//and we want to use it here
form.add(formBodyContainer, new MarginData(5));

//the form will be the single body widget for the FormPanel

TextButton saveButton = new TextButton("Save");

TextButton resetButton = new TextButton("Reset");

return framedPanel;


Images below:

This behaviour is related with the container I chose to hold a tab item content: VBoxLayoutContainer. Because if I change the createTabItem() method for the one commented out in the code above using a VerticalLayoutContainer, the problem does not occur.
I don't know what I'm doing rong. Can somebody help me?
Thanks in advance.