Vaadin 13 Flex成长

Question

我在使用Vaadin HorizonalLayout时遇到了问题--我想让左边的组件填满大部分的水平空间，如这个Fiddle所示

然而，当我运行我的Vaadin应用程序时，这两个组件平分了屏幕。

我的代码：

    HorizontalLayout layout = new HorizontalLayout();
    VerticalLayout left = new VerticalLayout(new Span("LEFT"));
    VerticalLayout right = new VerticalLayout(new Span("RIGHT"));

    layout.add(left, right);
    layout.setPadding(false);
    layout.setMargin(false);
    layout.setFlexGrow(1.0, left);
    layout.setFlexGrow(0,right);

我做错了什么？

Answer 1

如果你给HorizontalLayout的宽度一个定义的值(如100%)，同时将包含的VerticalLayouts的宽度设置为未定义的(“尽可能小”)，它就会起作用：

HorizontalLayout layout = new HorizontalLayout();
layout.setWidthFull();
VerticalLayout left = new VerticalLayout(new Span("LEFT"));
VerticalLayout right = new VerticalLayout(new Span("RIGHT"));
left.setSizeUndefined();
right.setSizeUndefined();

layout.add(left, right);
layout.setPadding(false);
layout.setMargin(false);
layout.setFlexGrow(1.0, left);
layout.setFlexGrow(0,right);
add(layout);

结果：

​

​