flexbox - 使用 CSS flex-box 的 Vaadin 布局？

Question

在Vaadin 8 ( Vaadin Framework ) 或 Vaadin 10 ( Vaadin FlowLayout )中是否有使用较新的CSS flex-box (aka flexbox) 功能？

这个优秀的教程使它看起来像 flex-box 可以用来实现 Vaadin 的GridLayout,VerticalLayout和HorizontalLayout.

Answer 1

瓦丁 8

如果你想在 Vaadin 8 中使用 flex-box，有以下选项

1. 如果您更喜欢服务器端 Java API，那么在目录https://vaadin.com/directory/component/flexlayout-add-on中有一个附加组件。

2. 您始终可以使用 CssLayout，并在主题中定义 CSS flex-box 规则

3. Board ( https://vaadin.com/directory/component/vaadin-board ) 组件是使用 flex-box 实现的

Vaadin 10（流）

Flow 中的所有 Layouts 都是使用 Flex-box 实现的，这使得它们可以更好地协同工作。Flow 中还有一个 FlexLayout，它以与上述附加组件类似的方式提供了 flex-box 的 Java API。Horizo​​ntalLayout 和 VerticalLayout 是 flex-box 的特殊情况，因此在组合它们时副作用更少（参见：https ://vaadin.com/docs/v10/flow/components/tutorial-flow-components-setup.html ）。