0

我创建了一个小部件来显示幻灯片。在 Firefox 中，一切都很好，但在 chrome 中没有任何反应。多次刷新后，幻灯片显示。我不知道为什么。你能给我一些想法吗？Tks 这是我的 GWT 客户端：

public SlideClient() {
    super();
    setStyleName("flexslider");
    setHeight("100%");
    setWidth("100%");

}

@Override
public void updateFromUIDL(UIDL uidl, ApplicationConnection client) {
    this.client = client;
    this.paintableId = uidl.getId();
    listImage = Arrays.asList(uidl.getStringArrayAttribute("listImage"));
    listUrl = Arrays.asList(uidl.getStringArrayAttribute("listUrl"));

    loadImage();
    checkImagesLoadedTimer.run();
}

public void display() {
    m.setStyleName("slides");
    m.setHeight("100%");
    m.setWidth("100%");
    add(m);
}

public native void slideshow() /*-{
$wnd.$('.flexslider').flexslider({slideshowSpeed: 2000});
}-*/;

public native String getURL(String url)/*-{
return $wnd.open(url,
'target=_blank')
}-*/;

private Timer checkImagesLoadedTimer = new Timer() {

    @Override
    public void run() {

        if (loadedImageElements.size() == toLoad) {
            display();
        } else {
            add(new Label("đang load "+loadedImageElements.size()));
            checkImagesLoadedTimer.schedule(2000);
        }
    }
};

private void loadImage() {
    for (String tmp : listImage) {
        AbsolutePanel panel = new AbsolutePanel();
        final Image ima = new Image(tmp);
        add(new Label("before put"));
        ima.addLoadHandler(new LoadHandler() {

            @Override
            public void onLoad(LoadEvent event) {
                loadedImageElements.put(toLoad+"", ima);
                slideshow();
                add(new Label("đang put "+loadedImageElements.size()));
            }
        });
        add(new Label("after put"));

        panel.add(ima);
        m.add(panel);

        if (toLoad != 0) {
            panel.setVisible(false);
        }
        toLoad++;

    }

}

}

4

1 回答 1

0

您是否实施了图像加载器来在图像显示之前准备图像？一个干净的解决方案是将图像元素作为不可见的实例添加到页面根目录，等待它们加载，然后在其他地方使用它们。

您还应该查看有关 ImageBundling 的教程：ImageResource

这是您要求的我的一个图像加载器类的一小部分摘录，尽管有不同的方法可以实现这一点：

private HashMap<String,ImageElement> loadedImageElements = new HashMap<String,ImageElement>();
private int toLoad = 0;

private void loadImage(final String name, String url){
    final Image tempImage = new Image(url);             
    RootPanel.get().add(tempImage);

    ++toLoad;

    tempImage.addLoadHandler(new LoadHandler(){
        public void onLoad(LoadEvent event) {               
            loadedImageElements.put(name,ImageElement.as(tempImage.getElement()));
            tempImage.setVisible(false);                
        }           
    });
}

图像 url 是通过指向图像真实位置的 ClientBundle-Interface 检索的。我还实现了一个在后台运行的计时器，以检查是否所有图像都已加载：

private Timer checkImagesLoadedTimer = new Timer(){
    public void run() {
        System.out.println("Loaded " + loadedImageElements.size() + "/" + toLoad + " Images.");
        if(loadedImageElements.size() == toLoad){
            buildWidget();
        }else{              
            checkImagesLoadedTimer.schedule(50);
        }
    }       
};

一切准备就绪后，就会创建原始的小部件/页面。

但正如我所说，有很多方法可以实现图像加载器。尝试不同的实现并选择最适合您需求的一种。

于 2012-06-11T09:21:39.503 回答