Question

在帖子底部回答

我创建了一个显示大量图片并在画布上绘制的网站。这些图像是PreloadedImage实例，并在其load事件上触发draw方法。这在Chrome中运行良好，但在Internet Explorer中，当使用PreloadedImage.getWidth（）或getOffsetWidth（）或getElement（）或getElement（）时，宽度为0（在Chrome中，它们的宽度正确）.getStyle（）。getWidth（） ......

在Eclipse中检查PreloadedImage的实例时，我可以看到该元素确实具有正确的宽度和高度，但是当GWT请求它时，结果为零，导致绘图不正确。

有什么想法吗？

编辑1：通过等待使用计时器完成加载来尝试它：

我快速尝试等待渲染图像，但似乎根本没有加载：

currentImage = new PreloadedImage();
currentImage.addLoadHandler(new LoadHandler() {
   @Override
   public void onLoad(LoadEvent event) {
       Timer timer = new Timer() {
           @Override
           public void run() {
           System.out.println("timer check: width: " +currentImage.getWidth());
              if(currentImage.getWidth()>0) {
                  //draw the image
                  this.cancel();
              }
           }
        };
        timer.scheduleRepeating(100);
    }
});

编辑2：更多信息：

加载图像时，在绘图之前，我会请求其尺寸。检查currentImage（PreloadedImage的实例）时，toString方法返回以下内容：

<img aria-hidden="true" 
style="display: none; visibility: hidden;" 
class="PRELOADEDIMAGE" 
src="/imageservlet?filename=1368280253128&amp;height=1000" width="1505" height="1000">

请注意，正确设置了宽度和高度。但是，在请求以下内容时：

currentImage.getWidth()
currentImage.getOffsetWidth()
String heightattr = e.getAttribute("height");

我得到的结果一直为零。我怀疑＆符号的编码是一个问题，但是Internet Explorer以与Chrome相同的方式处理它（最后，相同的url用于获取图像，并且它是正确的。）

Answer 1

我遇到了同样的问题，我无法在IE中获取不可见的图像。

你必须让它可见，获得宽度和高度并再次隐藏它（这是你做的，但是以一种更简单的方式）。

    Image img = new Image(imgData);
    img.setVisible(false);
    contentPane.add(img);
    img.addLoadHandler(new LoadHandler() {
        @Override
        public void onLoad(LoadEvent event) {
            img.setVisible(true); //make it visible just to work on IE
            int original_width = img.getWidth();
            int original_height = img.getHeight();

            img.setVisible(false); // hide it again

            //other stuff here
        }
    });

Answer 2

在图像上使用加载事件可能会很痛苦。我过去也遇到过类似的问题。我认为我使用的解决方案是设置一个setTimeout（function（）{...}，10）;在onLoad函数中。它为浏览器提供了渲染图像并获得正确尺寸的时刻

Answer 3

好的，愚蠢的，在问题工作几个小时并发布问题后，我或多或少直接找到了答案：放

this.getElement().getStyle().setDisplay(Display.BLOCK);

在任何维度调用和

之前

this.getElement().getStyle().setDisplay(Display.NONE);

如果有必要，IE可以检索正确的宽度。

GWT - PreloadedImage在IExplore中失败

3 个答案: