dart - Dartに画像をロードする方法

Question

Dart 言語と HTML5 Canvas 要素を試していますが、1 つの問題で立ち往生しています。Dart で画像を読み込む方法がわかりません。CanvasRenderingContext2D を取得でき、これで fillText() と fillRect() を呼び出すことができ、すべてが機能しますが、Image をロードして drawImage で描画する方法を理解しようとしています。

Answer 1

イメージを作成してロードする

ImageElement image = new ImageElement(src: "my_image.png");
image.onLoad.listen((e) {
    // Draw once the image is loaded
});

上記の画像を読み込んだ後、キャンバスに描画します

context.drawImage(image, destX, destY);

Answer 2

新しいイメージ オンロード構文:

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

Answer 3

これは別の方法です：

void main() {
  ImageElement image = new ImageElement(src: "pic.png");
  img.onLoad.listen(onData);
  img.onError.listen(onError);
}

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

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