1

これは、GWT プロジェクトの簡単な写真表示を実装するクラスです。

public class PhotosSlideShow extends Composite {

private List<Image> photos;
private int curr;
private AbsolutePanel mainPnl;
private SimplePanel centerPnl;
private Image n;
private Image p;
private final int WIDTH = 800;

public PhotosSlideShow(final List<String> result) {

    curr = 0;
    photos = new ArrayList<Image>();
    mainPnl = new AbsolutePanel();
    this.initWidget(mainPnl);
    this.setStyleName("slideShow");
    centerPnl = new SimplePanel();

    String path = GWT.getModuleBaseURL() + "imageUpload?src=";
    for (String foto : result) {
        String url = path.concat(foto);
        Image.prefetch(url);
        final Image curr = new Image(url);
        double ratio = getRatio(curr);
        curr.setPixelSize(WIDTH, (int) (ratio * WIDTH));

        curr.addMouseOverHandler(new MouseOverHandler() {

            @Override
            public void onMouseOver(MouseOverEvent event) {
                n.setVisible(true);
                p.setVisible(true);
            }

        });
        curr.addMouseOutHandler(new MouseOutHandler() {

            @Override
            public void onMouseOut(MouseOutEvent event) {
                n.setVisible(false);
                p.setVisible(false);
            }

        });
        photos.add(curr);

    }

    n = new Image("images/next.png");
    n.setPixelSize(40, 50);
    n.setVisible(false);
    n.addClickHandler(new ClickHandler() {

        @Override
        public void onClick(ClickEvent event) {
            showNext();
        }

    });

    p = new Image("images/prev.png");
    p.setPixelSize(40, 50);
    p.setVisible(false);
    p.addClickHandler(new ClickHandler() {

        @Override
        public void onClick(ClickEvent event) {
            showPrev();
        }

    });
    centerPnl.setWidget(photos.get(curr));
    mainPnl.add(centerPnl);
    mainPnl.add(n);
    mainPnl.add(p);
    posizionaBottoni();

}

private void showNext() {
    if (curr == photos.size() - 1) {
        curr = 0;
        centerPnl.setWidget(photos.get(curr));
    } else {
        curr++;
        centerPnl.setWidget(photos.get(curr));
    }
    posizionaBottoni();
}

private void showPrev() {
    if (curr == 0) {
        curr = photos.size() - 1;
        centerPnl.setWidget(photos.get(curr));
    } else {
        curr--;
        centerPnl.setWidget(photos.get(curr));
    }
    posizionaBottoni();
}

private void posizionaBottoni() {
    mainPnl.setWidgetPosition(p, 0,
            (int) (photos.get(curr).getHeight() / 2 - p.getHeight() / 2));
    mainPnl.setWidgetPosition(n, (int) (WIDTH - n.getWidth()),
            (int) (photos.get(curr).getHeight() / 2 - n.getHeight() / 2));
}

private double getRatio(Image i) {

    System.out.println("DIMENSIONI ORIGINALI: " + i.getWidth() + " x "
            + i.getHeight());
    double res = (double) i.getHeight() / i.getWidth();
    System.out.println("RATIO: " + res);
    return res;
}

}

どうやらすべて問題なく動作しているようですが、小さな問題が 1 つあります。画像の上にポインターを合わせると、ボタンが正しく表示されますが、マウスをボタンの上に移動してクリックすると、ちらつきます。この奇妙な動作の理由を知っている人はいますか? 前もって感謝します。

4

0 に答える 0