Loading...
Important Notice - Forums is archived

To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Product icon
TUTORIAL

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.

How to set height of Vertial Layout to 100%

Tushar Kale
9 years ago Jun 15, 2012 1:30am

The following code does not set the size of Vertical Panel to 100%.
I am setting background color of Vertical Layout to blue to see the size of the panel. I expected the complete browser window to be blue but only three lables appear with blue background.

@Theme("mytheme")
public class TestvaadinRoot extends Root {
	@Override
	public void init(WrappedRequest request) {
		setSizeFull();
		VerticalLayout vp = new VerticalLayout();
		vp.addStyleName("bgcolor");
		vp.setSizeFull();
		
		GridLayout grid = new GridLayout(1,3);
		grid.setSizeFull();
		
		grid.addComponent(new Label("Label1"));
		grid.addComponent(new Label("Label2"));
		grid.addComponent(new Label("Label3"));

		vp.addComponent(grid);
		addComponent(vp);
	}

}
Last updated on Jun, 15th 2012
Leif Åstrand
9 years ago Jun 18, 2012 12:43pm

Pressing the AL button in Vaadin's debug console (opened if ?debug is added to the URL) will tell you that there is a layout problem because your 100% high VerticalLayout is inside another VerticalLayout that has undefined height. This is the content layout of the Root.

To fix the problem, you could either add getContent().setSizeFull() to make the content layout have 100% height or then you could use your own VerticalLayout as the content layout using setContent(vp) instead of addComponent(vp).

Tushar Kale
9 years ago Jun 18, 2012 9:36pm
udo boysen
9 years ago Nov 19, 2012 9:01am