新组件被放置在中间而不是另一个在Vaadin VerticalLayout

我有Vaadin边栏菜单的问题，我有导航栏是50px高度。我希望放置边栏（此时只有带按钮的VerticalLayout），可以放置屏幕的其余部分。问题是，当我加入我的侧边栏主要布局从屏幕中间开始， like this:新组件被放置在中间而不是另一个在Vaadin VerticalLayout

我试图用

setSizeFull();

方法上我的主要布局，但那么它看起来like that（甚至当我设置我的侧边栏高度为100％）

还有就是我的侧边栏后面的代码：

公共类侧边栏{

private VerticalLayout sidebar; 
private Button menuItem01; 
private Button menuItem02 = new Button("Item02"); 

//Create Sidebar 
public VerticalLayout initSidebar() { 
    sidebar = new VerticalLayout(); 
    sidebar.setWidth("10%"); 
    sidebar.setHeight("100%"); 
    sidebar.setMargin(false); 
    sidebar.addComponent(createMenuItem()); 
    sidebar.addComponent(menuItem02); 
    sidebar.addStyleName("sidebar"); 
    return sidebar; 
} 

public Button createMenuItem(){ 
    menuItem01 = new Button("Item01"); 
    return menuItem01; 
}

}

，如果需要有代码我的MainView

@Override 
protected void init(VaadinRequest vaadinRequest) { 
    template.setMargin(false); 
    template.setSpacing(false); 
    //template.setSizeFull(); 

    //Place all elements together 
    template.addComponent(navigationBar.initNavigationBar()); 
    //template.addComponent(mainContent.initMainPanel()); 
    template.addComponent(sidebar.initSidebar()); 

    this.setContent(template); 
}

最后导航栏背后：

公共类导航栏{

private HorizontalLayout navbar; 
private Button hamburgerButton; 
private Label logo; 

//Create Navigation Bar 
public HorizontalLayout initNavigationBar() { 
    navbar = new HorizontalLayout(); 
    navbar.setWidth("100%"); 
    navbar.setMargin(true); 
    navbar.setHeight(50, Sizeable.Unit.PIXELS); 
    navbar.addComponent(createHamburgerButton()); 
    navbar.addComponent(createLogo()); 
    navbar.addStyleName("navigation-bar"); 
    return navbar; 
} 

//Create Hamburger Button 
public Button createHamburgerButton() { 
    hamburgerButton = new Button(); 

    //Added some styling to hamburger button 
    hamburgerButton.addStyleName("hamburger-button"); 
    hamburgerButton.setIcon(VaadinIcons.MENU); 

    return hamburgerButton; 
} 

//Create ElenX logo 
public Label createLogo() { 
    logo = new Label("ElenX"); 
    logo.addStyleName("elenx-logo"); 
    logo.setWidthUndefined(); 
    logo.setEnabled(false); 
    return logo; 
} 
}

任何想法？

来源

2015-11-06 Zeezl

如果一个VerticalLayout的高度为100％，它将与所有包含的组件均分共享该空间，除非您设置扩展比率。您可以通过verticalLayout.setExpandRatio(secondComponent, 1.0f)告诉垂直布局，以便为一个组件提供全部空间。这将会把你的第一个组件折叠到它所需要的房间，并将第一个组件从第一个到最后一个都给予第二个组件。

来源

2015-11-07 10:47:55 cfrick

template.addComponent（sidebar.initSidebar（））; template.setExpandRatio（sidebar.initSidebar（），1.0f）; – Zeezl

我得到了给定的组件不是这个布局错误的子集 – Zeezl

为什么你调用两次“initSidebar”？ – cfrick

新组件被放置在中间而不是另一个在Vaadin VerticalLayout

回答

相关问题