2

我是 GWT 的新手，我确信这在某处得到了回答，但我还没有找到

我下载了 GWT 2.0 eclipse 插件，很高兴看到它带有一个入门项目。

但是，令我惊讶的是，在运行它时，会出现令人不快的闪烁...

  1. 文本在没有 CSS 的情况下首先加载
  2. 选择框出现需要一段时间

（如果您没有看到闪烁，请尝试按F5刷新）

在此之前，所有成熟的 GWT 应用程序似乎都有一个加载器，但我没有找到一种简单、标准的方式来添加它。

看起来这个应用程序是按这个顺序加载的：（如果我把它弄混了，请纠正我，这只是我的猜测）

  • 基本布局 HTML，
  • 所有 JavaScript 和 CSS
  • 在“onload”事件上运行逻辑（您编译的 JavaScript 可以启动的最快时间 - ？）

所以我不能在加载 GWT 之前以编程方式添加加载微调器，对我来说有点 22

我错过了一些基本的东西吗？是否有添加初始微调器的最佳实践方法？

我想简单地添加一个带有动画 gif 的 div，并在 onload 事件中隐藏它。

但我确信有更好的东西。

让我知道这是否是重复的问题

更新：找到了这个相关的问题，虽然没有回答我的问题......

4

4 回答 4

2

我之前处理过这个问题，不使用 GWT 模块来加载 CSS，而是直接在标签本身中加载它。如果这样做，浏览器将始终首先加载 CSS，甚至在加载 GWT JS 之前。

这意味着您将失去一些灵活性和速度，但这是我迄今为止使用的唯一解决方法。

编辑：额外信息因为我想要赏金：D

如果您不 <inherits name='com.google.gwt.user.theme.standard.Standard'/>从 module.gwt.xml 文件中删除 ，则 GWT 标准主题将加载到 GWT 创建的 JS 文件中。该 JS 文件在 HTML 页面呈现后加载，并在加载后注入 CSS。因此闪烁。

为避免闪烁，您可以注释掉该行并将您自己的样式表插入到<head>您的 HTML 文件中。这可确保您的 CSS 在 HTML 呈现之前加载，避免任何闪烁。如果你真的想要 GWT 主题，你可以从源代码中得到它。

在 GWT 中使用微调器非常简单。一种简单的方法是将它保存在一个 div 中，并在 HTML 文件本身中有一个 id。然后，在 中onModuleLoad()，只需通过调用隐藏该 divRootPanel.get("spinner").setVisible(false);

这应该会显示微调器，直到 GWT 自行加载。

于 2010-01-10T04:20:57.600 回答
2

这是我们为实现微调器所做的工作。

您在加载应用程序的脚本行（即带有 nocache.js 的脚本行）下方放置了类似以下 HTML 的内容。例如：

    <div id="loading">
        <div id="loading-msg">
            <img src="icons/loading-page.gif" lt="loading">
            <span>Loading the application, please wait...</span>
        </div>    
    </div>

然后在您的应用程序 EntryPoint 中，您使用 DOM 进入页面并删除该 div。例如

final RootPanel loading = RootPanel.get("loading");
if (loading != null) {
    DOM.removeChild(RootPanel.getBodyElement(),
                    loading.getElement());
}
于 2010-01-19T14:50:07.027 回答
2

Ehrann：恐怕上述答案中提到的做法是目前唯一的方法。GWT 不提供类似的功能来“动态”显示/隐藏“加载”帧。我想其中一个原因是这个要求对于所有 GWT 用户来说并不是那么“普遍”，一个人可能想要一种与其他人完全不同的“加载”风格。所以你必须自己做。

您可以查看 GXT 展示页面（也基于 GWT）：http ://www.extjs.com/explorer/了解他们是如何做到的。关于它的来源，请在此处下载 Ext GWT 2.1.0 SDK：http ://www.extjs.com/products/gxt/download.php并在解压后查看 samples/explorer 文件夹。有关详细信息，请参阅下面的编辑：

编辑

检查http://www.extjs.com/examples/explorer.html的源代码，您可以看到一个 id 为“正在加载”的 div。对于每个样本（扩展视口），在 onAttach()（初始化）中调用 GXT.hideLoadingPanel(loadingPanelId)，它隐藏了加载帧。

在此处查看 Viewport 的源代码

在此处查看 GXT.hideLoadingPanel 的源代码

你可以用类似的方法来做。

于 2010-01-20T02:56:31.503 回答
1

您可以在主机页面中放置 HTML 加载消息（使用样式属性或在标题中嵌入样式标签以确保其样式），并在模块加载后删除该消息，例如 Document.get().getBody( ) 使用 .setInnerHTML("") 或 .removeChild()，然后根据需要以编程方式呈现您的应用程序。

于 2010-01-14T09:56:40.560 回答