2

我之前在这里发布了一个问题（如何在 Dart 中加载图像）并得到答案，但同时得到更多问题。为什么我只能以这种方式绘制图像：

image.on.load.add((e) {
    context.drawImage(image, 0, 0);
});

但如果我写的是这样的：

ImageElement image = new ImageElement();
image.src = 'myImage.png';
context.drawImage(image, 0, 0);

^^^ 这不起作用，不要绘制图像。为什么？

bool loaded = false;
ImageElement image = new ImageElement();
image.src = 'myImage.png';
image.on.load.add((e) {
    loaded = true;
});
print(loaded); // on console get - false

^^^ 为什么我是假的？如果图像加载的变量加载为真，但加载的变量不为真，我就创建了。

对不起我的英语不好。谢谢！

4

2 回答 2

6

至于你的第一个问题，如果你遗漏了

image.onLoad.listen((e) {
    context.drawImage(image, 0, 0);
});

那么加载图像时不会执行任何代码。

on.load.add (...)构造基本上分配了一个函数（通常称为处理程序），该函数将在浏览器加载图像时执行。如果没有分配这样的函数，则加载图像时不会发生任何事情，因此context.drawImage(image, 0, 0)将不起作用。

您的第二个问题与此功能有关。加载图像是一个异步过程，这意味着您的加载处理程序 ( on.load.add(...) ) 在客户端成功加载图像时首先被触发。这意味着在加载您的加载处理程序执行后继续执行您的下一个调用：print(loaded)这将是错误的，因为图像尚未加载。

于 2012-07-23T18:34:26.427 回答
5

较新的图像加载语法：

readFile() {
  ImageElement image = new ImageElement(src: "plant.png");
  document.body.nodes.add(image);
  image.onLoad.listen(
      onData, 
      onError: onError, 
      onDone: onDone, 
      cancelOnError: true
   );
}

onData(Event e) {
  print("success");
}

onError(Event e) {
  print("error: $e");
}

onDone() {
  print("done");
}
于 2013-06-01T20:37:35.723 回答