Question

工作:(文档有一个img标签，id =“img”src =“img.png”，它有效）

  void test() {
    ImageElement img = query('#img');
    context.drawImage(img, 0, 0);
  }

不工作：

  void test() {
    ImageElement img = new ImageElement(src: 'img.png');
    context.drawImage(img, 0, 0);
  }

那么，为什么我不能在文档中使用'new ImageElement'而不是'query'？

Answer 1

问题是，在您调用drawImage时，图像尚未加载（与嵌入页面并在dart代码运行之前加载时相反）。你应该监听onLoad流，只在加载后绘制图像：

  ImageElement img = new ImageElement(src: "img.png");
  img.onLoad.listen((value) => context.drawImage(img, 0, 0));

Answer 2

我以为我会在onError，onDone和cancelOnError引用中详细说明图像onload语法......

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");
  }

使用ImageElement绘制drawImage

2 个答案: