我们的GWT应用程序有各种片段,每个片段都非常大(1 + MB)。我们想要做的是在GWT下载片段时显示进度条。我们正在使用基于GWTP的代码分割。
我在GWT源代码中找不到任何与片段加载事件相关的内容。有没有人知道如何在页面上的Javascript通知下一个要下载哪个片段?
答案 0 :(得分:3)
没有任何直接的方法,但你可以基本上以两种方式解决方法
1.-扩展CrossSiteIframeLinker
并覆盖方法getJsInstallScript()
,以便您可以返回自定义的javascript内容,该内容可以以某种方式提醒用户有关正在加载的排列或仅显示微调器。请注意,您的脚本应包含类似于installScriptEarlyDownload.js
或installScriptDirect.js
// Your linker class
public class MyXSILinker extends CrossSiteIframeLinker {
@Override
protected String getJsInstallScript(LinkerContext context) {
return "/your_namespace/your_script.js";
}
}
// your "/your_namespace/your_script.js" script
function installScript(filename) {
}
// your module file
<define-linker name="mylinker" class="...MyXSILinker" />
<add-linker name="mylinker" />
2.-使用window.__gwtStatsEvent
功能。您可以在index.html
中定义一个函数,以便在将加载应用程序的脚本添加到您的文档时启动加载微调器,然后使用您的gwt代码将其删除。
// In your index.html
<head>
<script>
window.__gwtStatsEvent = function(r) {
if (r.type == 'scriptTagAdded') {
d = document.createElement('div')
d.id = 'loading'
d.innerHTML = 'Loading...'
document.body.appendChild(d);
}
}
</head>
</script>
// In your EntryPoint class
Document.get().getElementById("loading").removeFromParent();
要显示准确的进度条非常困难,因为<script>
标记不支持进度事件。所以最好的方法应该是使用ajax加载排列的链接器,因此你可以在xhr
对象中使用html5进度事件。
我会使用#2方法显示一个使用css动画的漂亮微调器。