Vaadin 8:如何在长时间加载导航到其他视图之前显示 ProgressBar window
Vaadin 8: How to show ProgressBar window before navigating to other view with long loading
我想导航到单击按钮后在网格中显示大量数据的视图。我知道有延迟加载,但我想加载所有数据以便能够通过单击 header 进行排序。通过延迟加载,我只能对一列进行排序。
Button viewDataBtn = new Button("View scan data");
viewDataBtn .addClickListener(e -> {
UI.getCurrent().getNavigator().navigateTo("scandataview/" + name);
});
这确实有效,但在新视图可见之前会有很长的休息时间。
因此,我想显示一个 window 和一个进度条,直到加载新视图并在另一个线程中加载新视图。我尝试了以下但没有成功:
viewDataBtn .addClickListener(e -> {
UI.getCurrent().addWindow(showProgress);
new Thread(new Loader()).start();
});
同class:
class Loader implements Runnable {
@Override
public void run() {
try {
//Nullpointer exception here:
UI.getCurrent().getNavigator().navigateTo("scandataview/" + name);
} catch (Exception e) {
e.printStackTrace();
}
finally {
UI.getCurrent().removeWindow(showProgress);
}
}
}
和进度条window:
public class LoadingIndicatorWindow extends Window {
public LoadingIndicatorWindow() {
center();
setVisible(true);
setResizable(false);
setDraggable(false);
setModal(true);
setClosable(false);
setCaption("Loading");
VerticalLayout layout = new VerticalLayout();
layout.setMargin(true);
layout.setWidth("100%");
Label progressLabel = new Label("Please wait! Data loading in progress...");
progressLabel.setSizeFull();
ProgressBar progressBar = new ProgressBar();
progressBar.setSizeFull();
progressBar.setIndeterminate(true);
progressBar.setVisible(true);
layout.addComponent(progressLabel);
layout.addComponent(progressBar);
layout.setComponentAlignment(progressLabel, Alignment.MIDDLE_CENTER);
layout.setComponentAlignment(progressBar, Alignment.MIDDLE_CENTER);
setContent(layout);
}
}
看来我无法在不同的线程中导航。
有没有什么方法可以在导航到另一个视图之前显示进度条 window 当该视图准备好显示带有数据的大网格时???
非常感谢您的帮助!
我建议观看 Alejandro 关于该主题的精彩 tutorial。
试试这个:
https://github.com/ldelaprade/ProgressWindowForVaadin
此进度 window 会在长任务完成后自动关闭。
适用于无需多线程。
这里的技巧是你要求进度 window 出现,
然后当它获得焦点时,它要求服务器开始长时间操作。
洛朗
正如 Tatu Lund 所指出的,Alejandro 的教程很棒。但是,不完全是我需要的。因此,我想post我的答案。
我发现以下link 有帮助:
加载程序 class 现在看起来如下:
class Loader implements Runnable {
@Override
public void run() {
try {
getUI().access(() -> {
getUI().getNavigator().navigateTo("scandataview/" + name);
});
} catch (Exception e) {
e.printStackTrace();
}
}
}
为了关闭进度 window 我在 UI class 中创建了一个 LoadingIndicatorWindow 实例,并将其提供给两个视图。 window 在显示 "grid display code" 之后的数据的视图中关闭
UI.getCurrent().removeWindow(showProgress);
我想导航到单击按钮后在网格中显示大量数据的视图。我知道有延迟加载,但我想加载所有数据以便能够通过单击 header 进行排序。通过延迟加载,我只能对一列进行排序。
Button viewDataBtn = new Button("View scan data");
viewDataBtn .addClickListener(e -> {
UI.getCurrent().getNavigator().navigateTo("scandataview/" + name);
});
这确实有效,但在新视图可见之前会有很长的休息时间。 因此,我想显示一个 window 和一个进度条,直到加载新视图并在另一个线程中加载新视图。我尝试了以下但没有成功:
viewDataBtn .addClickListener(e -> {
UI.getCurrent().addWindow(showProgress);
new Thread(new Loader()).start();
});
同class:
class Loader implements Runnable {
@Override
public void run() {
try {
//Nullpointer exception here:
UI.getCurrent().getNavigator().navigateTo("scandataview/" + name);
} catch (Exception e) {
e.printStackTrace();
}
finally {
UI.getCurrent().removeWindow(showProgress);
}
}
}
和进度条window:
public class LoadingIndicatorWindow extends Window {
public LoadingIndicatorWindow() {
center();
setVisible(true);
setResizable(false);
setDraggable(false);
setModal(true);
setClosable(false);
setCaption("Loading");
VerticalLayout layout = new VerticalLayout();
layout.setMargin(true);
layout.setWidth("100%");
Label progressLabel = new Label("Please wait! Data loading in progress...");
progressLabel.setSizeFull();
ProgressBar progressBar = new ProgressBar();
progressBar.setSizeFull();
progressBar.setIndeterminate(true);
progressBar.setVisible(true);
layout.addComponent(progressLabel);
layout.addComponent(progressBar);
layout.setComponentAlignment(progressLabel, Alignment.MIDDLE_CENTER);
layout.setComponentAlignment(progressBar, Alignment.MIDDLE_CENTER);
setContent(layout);
}
}
看来我无法在不同的线程中导航。
有没有什么方法可以在导航到另一个视图之前显示进度条 window 当该视图准备好显示带有数据的大网格时???
非常感谢您的帮助!
我建议观看 Alejandro 关于该主题的精彩 tutorial。
试试这个: https://github.com/ldelaprade/ProgressWindowForVaadin
此进度 window 会在长任务完成后自动关闭。 适用于无需多线程。 这里的技巧是你要求进度 window 出现, 然后当它获得焦点时,它要求服务器开始长时间操作。
洛朗
正如 Tatu Lund 所指出的,Alejandro 的教程很棒。但是,不完全是我需要的。因此,我想post我的答案。
我发现以下link 有帮助:
加载程序 class 现在看起来如下:
class Loader implements Runnable {
@Override
public void run() {
try {
getUI().access(() -> {
getUI().getNavigator().navigateTo("scandataview/" + name);
});
} catch (Exception e) {
e.printStackTrace();
}
}
}
为了关闭进度 window 我在 UI class 中创建了一个 LoadingIndicatorWindow 实例,并将其提供给两个视图。 window 在显示 "grid display code" 之后的数据的视图中关闭
UI.getCurrent().removeWindow(showProgress);