代码之家 › 专栏 › 技术社区 › Stephane Grenier

有没有办法将进度条与Vaadin Flow中的Upload组件分离开来?

vaadin-flow vaadin

0

Stephane Grenier · 技术社区 · 4 年前

我可以看到,你可以自定义按钮,也可以调整上传组件中是否允许上传,但有没有任何方法可以拉出进度条,使其显示在弹出窗口中。我问是因为我的上传组件是 HorizontalLayout a以上 Grid 进度条看起来很糟糕。相反,我想在弹出窗口或类似的东西中展示进度。这可能吗?如果可能的话,该怎么办。我在API或用户手册中找不到任何内容: https://vaadin.com/docs/latest/ds/components/upload

我目前的代码是(非常基本的原型):

MultiFileMemoryBuffer multiFileMemoryBuffer = new MultiFileMemoryBuffer();
Upload multiFileUpload = new Upload(multiFileMemoryBuffer);
multiFileUpload.addSucceededListener(event -> {
    System.out.println("File uploaded : " + event.getFileName());
});
multiFileUpload.setDropAllowed(false);
multiFileUpload.setUploadButton(new Button("Upload"));

我确实看到一个名为 addProgressListener() 然而,我想我可以用它在其他地方添加进度条,但我找不到删除当前进度条的方法。另一个问题是它附带的复选标记、错误消息等。理想情况下,将所有内容都放在弹出通知窗口或类似的窗口中会很好。。。

0 回复 | 直到 4 年前

1

0

Rolf 4 年前

包含进度条、错误消息等的文件列表可以通过css隐藏,方法是将文件列表阴影部分作为目标 [part="file-list"] { display: none; } 在vaadin-upload.css样式表中,或使用 vaadin-upload::part(file-list) { display: none; } 来自全局样式表。

不幸的是,您将不得不重新创建相应的UI,例如在覆盖中,但有一个 <vaadin-upload-file> 您可以利用的web组件。