如何在vaadin 7中布局FormLayout，就像在vaadin 6中的Form一样？

Question

我正在尝试将应用程序从vaadin 6.8迁移到vaadin 7.由于在vaadin 7中不推荐使用Form类，我正在尝试使用FieldGroup构建我的表单并使用FormLayout显示它们。建筑不是问题，但布局不是那么顺利。现在我有两个问题。

1. 如何在表单的整个宽度上显示表单描述？我希望它具有完全相同的宽度，既不宽也不仅在第二列。

2. 如何添加按钮（确定和取消），使它们彼此相邻，而不仅仅是在第二列？就像旧Form类中的页脚一样。

这可以使用FormLayout还是使用其他布局？

谢谢你 拉斐尔

Answer 1

注意：我在上周才开始调查V7，所以请谨慎对待我的回复......

这两个问题都源于FormLayout从未提供页眉和页脚的事实 - Form类的确如此。

我建议您创建自己的等效Form，它具有标题布局，FormLayout和页脚布局，例如（未尝试使用，可能需要使用GridLayout而不是VerticalLayout用于mainLaout）

public class FormComponent extends CustomComponent {
  private Layout mainLayout;

  protected Layout header;
  protected Layout central;
  protected Layout footer;

  public FormComponent() {
    init(new HorizontalLayout(), new FormLayout(), new HorizontalLayout());
  }

  protected void init(Layout header, Layout central, Layout footer) {
    this.footer = footer;
    this.header = header;
    this.central = central;

    mainLayout = new VerticalLayout();
    mainLayout.addComponent(header);
    mainLayout.addComponent(central);
    mainLayout.addComponent(footer);

    setCompositionRoot(mainLayout);
    setSizeUndefined();
  }

  public Layout getHeader() {
    return header;
  }

  public Layout getCentral() {
    return central;
  }

  public Layout getFooter() {
    return footer;
  }
}

Answer 2

1. 在Vaadin 7中，没有与Vaadin 6 Form组件等效的内置组件。所以你必须创建自己的。
2. 创建新的Horizo​​ntalLayout并向其添加“确定”和“取消”按钮。然后将Horizo​​ntalLayout添加到FormLayout。