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

これは、あなたが要求した私の画像ローダー クラスの 1 つからの抜粋ですが、それを実現するにはさまざまな方法があります。

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 に答える