user3702643
user3702643

Reputation: 1495

Vaadin panels not displaying correctly

Hi I am trying to created 2 panels, one as a sidebar and the other as a content panel but they are not displaying correctly. There is a huge white space between the 2 panels. Does anyone know how to fix this?

HorizontalLayout mainlayout = new HorizontalLayout();
mainlayout.setSizeFull();

Panel sidepanel = new Panel();
sidepanel.addStyleName(ValoTheme.PANEL_BORDERLESS);
sidepanel.setHeight("100%");
sidepanel.setWidth("20%");      

Panel content = new Panel();
content.addStyleName(ValoTheme.PANEL_BORDERLESS);
content.setHeight("100%");
content.setWidth("80%");

mainlayout.addComponent(sidepanel);
mainlayout.addComponent(content);

Upvotes: 0

Views: 113

Answers (2)

Jonas Granvik
Jonas Granvik

Reputation: 935

HorizontalLayout mainlayout = new HorizontalLayout();
mainlayout.setSizeFull();

Panel sidepanel = new Panel();
sidepanel.addStyleName(ValoTheme.PANEL_BORDERLESS);

Panel content = new Panel();
content.addStyleName(ValoTheme.PANEL_BORDERLESS);

mainlayout.addComponent(sidepanel);
mainlayout.addComponent(content);

mainlayout.setExpandRatio(sidepanel, 2);
mainlayout.setExpandRatio(content, 8);

Upvotes: 1

André Schild
André Schild

Reputation: 4754

Set both panels to 100% size. Then set the expand ratio of the parent layout to 20 and 80.

https://vaadin.com/api/com/vaadin/ui/AbstractOrderedLayout.html#setExpandRatio%28com.vaadin.ui.Component,%20float%29

Upvotes: 2

Related Questions