Vaadin 8 中的重叠进度条
我想知道我是否可以在 Vaadin 8 中实现这样的目标:
橙色条代表一个进度,绿色条代表另一个进度,它是橙色的子集。基本上,绿色条可以小于或等于橙色条。
现在,我只有
以下是代码:
AbstractLayout progressBarInformationLayout =
VaadinLayoutUtility.getInstance().generateHLayout();
progressBarInformationLayout.setStyleName("dashboard_progress_bar_info_layout");
layout.addComponent(progressBarInformationLayout);
float progressBarValue = actualIncludeTotal / (float) predictedInclude;
ProgressBar progressBar = new ProgressBar(progressBarValue);
progressBar.setId("dashboard_progress_bar");
progressBar.setWidth("230px");
progressBar.setStyleName("progress_bar");
progressBarInformationLayout.addComponent(progressBar);
Label progressLabel = new Label(df2.format(progressBarValue * 100) + "%");
progressLabel.setStyleName("progress_label");
progressBarInformationLayout.addComponent(progressLabel);
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我还没有尝试过这个,但我认为通过扩展/覆盖 ProgressBar 及其相关类以具有两个或更多进度指示器,这是半容易做到的。
请参阅 VProgressBar,调用getWidget().setState(getState().state); href="https://github.com/vaadin/framework/blob/master/client/src/main/java/com/vaadin/client/ui/progressbar/ProgressBarConnector.java" rel="nofollow noreferrer">ProgressBarConnector< /a>,state href="https://github.com/vaadin/framework/blob/master/shared/src/main/java/com/vaadin/shared/ui/progressindicator/ProgressBarState.java" rel="nofollow noreferrer">ProgressBarState< /a> 以及 getValue 和
setValue
处理href="https://github.com/vaadin/framework/blob/master/server/src/main/java/com/vaadin/ui/ProgressBar.java" rel="nofollow noreferrer">进度条 - - 您将需要复制所有这些。您还需要额外指示器的样式(请参阅 进度条的 Valo 样式)。鉴于上述三个类是客户端类,请查看 Client -Side Development 文档(如果您以前不熟悉它),并记住在每次更改后重新编译您的小部件集。
如果您想要一个版本,其中第二个栏不是第一个栏的子集,而是完全不同的进度,并且不预先知道哪个任务最慢,我想您还需要额外的逻辑来确定哪个栏是在下面(否则较快的可能会隐藏较慢的),并且可能用于在条的相对速度发生变化时交换条的颜色。或者您可以调整设计,使两个栏始终可见。
I haven't tried this, but I'd assume it's semi-easily doable by extending/overriding ProgressBar and its related classes to have two or more progress indicators.
See the handling of
indicator
variable in VProgressBar, calling ofgetWidget().setState(getState().state);
in ProgressBarConnector, variablestate
in ProgressBarState, and thegetValue
andsetValue
handling in ProgressBar -- you are going to need to duplicate all of those. You'll also need styling for the extra indicators (see Valo styles for ProgressBar).Given that three of the above are client-side classes, take a look at the Client-Side Development documentation if you aren't familiar with it from before, and remember to recompile your widgetset after every change.
If you ever want a version where the second bar isn't a subset of the first one but a completely different progress, and don't know upfront which task is slowest, I suppose you'll also need extra logic for determining which bar is underneath (otherwise the faster one might hide the slower one), and possibly for swapping the colors of the bars if their relative speed changes. Or you could tweak the design so that both bars are always visible.