java - 有没有办法在 Vaadins DateTimePicker 组件中垂直堆叠日期和时间？

Question

为了在我的 UI 中选择不同数据类型的一些值，我使用DateTimePicker了 14.3.x 中引入的Vaadin。

我想知道我是否可以以某种方式垂直而不是水平放置日期和时间输入字段？看图片：

DateTimePicker 组件在这里只是水平宽度。而且我也没有选择使所有其他输入（例如用于字符串的输入）更宽。

我已经检查了API，但似乎没有实现垂直堆叠的标准方法。有谁知道如何完成这项工作？

Answer 1

使用 CSS 是可行的。在您的 Java 类中，为该类添加一个 CSS 导入注释，如下所示：

@CssImport(value = "./styles/dtp.css", themeFor = "vaadin-date-time-picker")
public class MyView extends Div { 
//...

创建时DateTimePicker：

        DateTimePicker dateTimePicker = new DateTimePicker();
        dateTimePicker.setClassName("stacked");

并在/frontend/styles/dtp.css：

:host(.stacked) .slot-container {
    display: flex;
    flex-direction: column;
}