如何在列表框上添加滚动条

Question

在 Vaadin 14 中，我想要一个带有滚动条的列表框。要么永久存在，要么更好，当列表所需的 space 超过列表框的最大高度时出现。它不一定必须使用 vaadin 核心组件来完成；如果有其他东西可以完成同样的工作并且可以轻松集成到我的 Vaadin 应用程序中，那也很好。

我对 web components 的经验很少，不知道从哪里开始实现它。如果需要更多知识，请指点我学习的正确方向。

Answer 1

这就是 ListBox 组件在 Vaadin 中的工作方式 :) 如果 space 不足以显示所有项目，则会出现滚动条

ListBox<String> listBox = new ListBox<>();
listBox.setItems("Bread", "Butter", "Milk");
listBox.setHeight("100px");
add(listBox);

Web 组件 Vaadin 文档页面 Vaadin-ListBox HTML

Answer 2

设置高度将起作用，对最大高度进行较小的 CSS 更改也将起作用。这是您需要添加到主题中的内容。

在 Java（Vaadin 14+）中：

@CssImport(value = "./styles/my-styles.css", themeFor = "vaadin-list-box")

在CSS (my-styles.css):

[part="items"] {
  flex: auto;
  height: auto;
}

How to add a scrollbar on a listbox