Help with layouts

Hi guys…

I’m trying Vaadin about the possibility to use it at my company…

As my first project, I’m trying to create a very simple layout, but nothing is working correctly…
I have read the book any times, searching for a solution, but this seams to be so complicated for me…

Here is it:

  • at top a banner
  • at left, a menu
  • at the client area a table

This is the code:


public class MyApp extends Application {

	private Component test() {
		VerticalLayout v = new VerticalLayout();

		Panel banner = new Panel("Banner");
		banner.setHeight("50px");
		v.addComponent(banner);

		HorizontalLayout h = new HorizontalLayout();
		h.setSizeFull();
		v.addComponent(h);

		Panel menu = new Panel("Menu");
		menu.setWidth("300px");
		h.addComponent(menu);

		Table t = new Table();
		t.setSizeFull();
		h.addComponent(t);

		return v;
	}

	@Override
	public void init() {
		Window mainWindow = new Window("My Test");
		VerticalLayout content = new VerticalLayout();
		mainWindow.setContent(content);
		content.setSizeFull();
		mainWindow.setSizeFull();
		mainWindow.addComponent(test());
		setMainWindow(mainWindow);
	}
}

The result is attached…

What i’m doing wrong?
12492.jpg

Here’s a version of test() that works (see the // Added comments):

private Component test() {
		VerticalLayout v = new VerticalLayout();
		v.setSizeFull(); // Added

		Panel banner = new Panel("Banner");
		banner.setHeight("50px");
		v.addComponent(banner);

		HorizontalLayout h = new HorizontalLayout();
		h.setSizeFull();
		v.addComponent(h);
		v.setExpandRatio(h, 1); // Added

		Panel menu = new Panel("Menu");
		menu.setWidth("300px");
		menu.setHeight("100%"); // Added
		h.addComponent(menu);

		Table t = new Table();
		t.setSizeFull();
		h.addComponent(t);
		h.setExpandRatio(t, 1); // Added

		return v;
	}

“Holy setExpandRatio”

:grin:

Thanks man!