带页脚的垂直布局？答案

【问题标题】：VerticalLayout with footer?带页脚的垂直布局？
【发布时间】：2014-02-14 11:27:48
【问题描述】：

我正在寻找一种在我的 VerticalLayout 中创建页脚的方法。有一些方法可以用 VerticalLayout 创建页脚吗？

有什么想法吗？

【问题讨论】：

标签： java frameworks vaadin vaadin7

【解决方案1】：

这取决于页脚的含义，但最简单的方法是添加一个 HorizontalLayout 作为 VerticalLayout 中的最后一个元素。

只需确保 VerticalLayout 中的其他组件设置为由容器扩展即可。（在 VerticalLayout 组件中查找 setExpandRatio(...)。

【讨论】：

我正在尝试使用 setExpandRatio(footer, 1.0f) 但不起作用。我正在尝试这个。 ` 公共类 PrincipalLayout 扩展 VerticalLayout{ 私有 HorizontalLayout 页脚； public PrincipalLayout(){ footer = new HorizontalLayout(); this.addComponent(footer); this.setExpandRatio(footer, 1.0f); } } `
你不能设置页脚的扩展率，但其他组件。当组件没有设置 ExpandRatio 时，它不会扩展/收缩。以vaadin.com/de/book/-/page/layout.orderedlayout.html 为例。

【解决方案2】：

一个简单的解决方案。 André Schild 已经提供了宝贵的意见。

VerticalLayout vlMain = new VerticalLayout();
vlMain.setSizeFull();

HorizontalLayout hlFooter = new HorizontalLayout();
hlFooter.setHeight("50px"); // if you want you can define a height.
hlFooter.addComponent(new Label("Test1")); // adding a simple component. You might want to set alignment for that component

vlMain.addComponent(mainComponent);
vlMain.setExpandRatio(mainComponent, 1.0f); // "give" the main component the maximum available space
vlMain.addComponent(hlFooter);

【讨论】：

【解决方案3】：

现在我解决了我的问题，我做到了并且工作正常。

public class PrincipalLayout extends VerticalLayout{
private HorizontalLayout header, center, footer;

public PrincipalLayout(){       
    setSizeFull();      
    initComponents();
    defineLayout();
}

private void initComponents(){
    header = new HorizontalLayout();        
    center = new HorizontalLayout();        
    footer = new HorizontalLayout();        

    header.addComponent(new Label("HEADER"));
    center.addComponent(new Label("CENTER"));
    footer.addComponent(new Label("FOOTER"));
}

private void defineLayout(){
    addComponent(header);
    addComponent(center);
    addComponent(footer);

    setExpandRatio(center, 1.0f);
}

}

【讨论】：