Question

尝试使用Canvas和Dart渲染图像但是我没有运气。

有人能指出我正确的方向吗？请参阅随附的代码。

import 'dart:html';

class Board{

  CanvasElement canvas;
  CanvasRenderingContext2D context;

  Board(){
    canvas = new CanvasElement(width: 600, height: 600);
    context = canvas.context2D;
  }

  getCanvas(){
    return canvas;
  }

  getContext(){
    return context;
  }

}

class Player{

  ImageElement player;
  CanvasRenderingContext2D context;
  CanvasElement canvas;

  Player(theCanvas, theContext){
    canvas = theCanvas;  
    context = theContext;
  }

  drawPlayer(){
    player = new Element.tag("img");
    player.id = "#thePlayer";
    player.src = "img/player.png";
    context.drawImage(player, 100, 100);
  }

  getPlayer(){
    return player;
  }

}

void main() {
  Board b = new Board();
  Player p = new Player(b.getCanvas(), b.getContext());
  p.drawPlayer(); 

}

Answer 1

这是因为在Dart VM运行时尚未从服务器加载图像。

为了纠正这个问题，在显示播放器之前我检查了图像已经加载。

player.onLoad.listen( (value) => context.drawImage(player, 0, 0) );

Dart Canvas不绘制图像

1 个答案: