Structuring widgets on VLayout issue

[zaj]

Hello there,

I am trying to structure my widgets depending on the button clicked on the RibbionBar. I have a VLayout on which I have added a RibbonBarwith 4 buttons. Now depending on the button clicked I want to display different forms in the VLayout and below the RibbonBar. Can somebody help me to get started. I tried but not working as expected. When I click on the button in the ribbonBar the listgrid is drawn/shown over the ribbonBar instead of showing it below the ribbonBar.

                ribbonBar.addMember(orderGroup);
		ribbonBar.addMember(reportGroup);
		ribbonBar.addMember(productGroup);
		ribbonBar.addMember(systemGroup);

		vLayout.addChild(ribbonBar);
		vLayout.draw();

then in the clickHandler of the first button in the RibbonBar I have this which draws the listgrid.

order.addClickHandler(new ClickHandler()
		{
			@Override
			public void onClick(ClickEvent event)
			{
				vLayout.addChild(createOrderFrame());
			}
		});

	protected ListGrid createOrderFrame()
	{
		//DataSource ds = DataSource.get("");
		ListGrid listGrid = new ListGrid();
		listGrid.setWidth100();
		listGrid.setHeight(200);
		//listGrid.setDataSource(dataSource);
		listGrid.setAutoFetchData(true);
		listGrid.addRecordClickHandler(new RecordClickHandler()
		{
			public void onRecordClick(RecordClickEvent event)
			{

			}
		});
		return listGrid;
		
	}