在GWT中加载图像

时间:2012-03-08 07:01:39

标签: html css gwt

我一直在GWT的一个项目上工作,我需要将加载图像显示为“Please Wait ...”。

我能够解决此问题直到页面加载。但在历史令牌改变期间,我无法表现出同样的情况。我创建了一个部门,如下所示,

<div id="loader">
            <div id="loaderPanel">
            </div>
            <div id="loaderImage">
                <div id="loaderText">
                    <b>Please Wait...</b>
                </div>
                <img src="images/loader.gif"/>
            </div>
        </div>

此外,这是我的CSS

#loaderPanel {
    background-color: white;
    display: block;
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1001;
}


#loaderImage {
    background-color: transparent;
    left: 48%;
    position: fixed;
    top: 48%;
    z-index: 1002;
}

#loaderImage img{
    height:22px;
    margin-left:4px;
    margin-top:0px;
    width:119px;
}   

#loaderText{
    font-family:'Verdana';
    font-weight:bold;
    font-size:0.9em;
    float:left;
}

这是我用来使DIV可见的代码片段。不可见的。

DOM.getElementById("loader").getStyle().setDisplay(Display.NONE);
DOM.getElementById("loader").getStyle().setDisplay(Display.BLOCK);

有人可以建议我更好地为历史记录更改显示加载的GIF图片吗?

2 个答案:

答案 0 :(得分:0)

你应该实现HistoryListener并在调用onModuleLoad()方法时显示gif:

http://google-web-toolkit.googlecode.com/svn/javadoc/1.5/com/google/gwt/user/client/History.html

答案 1 :(得分:0)

我得到了答案,

它没有显示加载图像,因为本地执行速度要快得多。但是当谈到生产模式时,我发现它正在显示加载图像一段时间。

由于我的客户严格需要显示加载程序,他建议我添加一个小延迟。所以我在Timer Scheduled中添加了延迟。当它显示加载器时,我完成了预览图像和页面中使用的其他对象。

所以我将我的问题标记为已关闭 ...