在居中的PopupPanel中显示GWT图片onLoad

Question

使用GWT我正在用ClickHandler显示图片缩略图，然后在居中的PopupPanel中显示完整图片（可能为几MB）。为了让它居中，必须在显示弹出窗口之前加载图像，否则图像的左上角放置在屏幕中间（图像认为它是1px大）。这是我使用这样做代码：

private void showImagePopup() { 
     final PopupPanel popupImage = new PopupPanel(); 
     popupImage.setAutoHideEnabled(true); 
     popupImage.setStyleName("popupImage"); /* Make image fill 90% of screen */ 

     final Image image = new Image(); 
     image.addLoadHandler(new LoadHandler() { 
      @Override 
      public void onLoad(LoadEvent event) { 
       popupImage.add(image); 
       popupImage.center(); 
      } 
     }); 
     image.setUrl(attachmentUrl + CFeedPostAttachment.ATTACHMENT_FILE); 
     Image.prefetch(attachmentUrl + CFeedPostAttachment.ATTACHMENT_FILE); 
    } 

然而，LoadEvent事件从来没有发射，因此图像永远不会显示。我该如何克服这一点？我想避免使用http://code.google.com/p/gwt-image-loader/，因为如果我可以避免它，我不想添加额外的库。谢谢。

Answer 1

onLoad()方法只会在图像加载到DOM后触发。这是一个快速的解决方法：

... 

final Image image = new Image(attachmentUrl + CFeedPostAttachment.ATTACHMENT_FILE); 
image.addLoadHandler(new LoadHandler() { 
    @Override 
    public void onLoad(LoadEvent event) { 
     // since the image has been loaded, the dimensions are known 
     popupImage.center(); 
     // only now show the image 
     popupImage.setVisible(true); 
    } 
}); 

popupImage.add(image); 
// hide the image until it has been fetched 
popupImage.setVisible(false); 
// this causes the image to be loaded into the DOM 
popupImage.show(); 

... 

希望有所帮助。