GWT 캔버스 2D 그리기 이미지

Question

/** 
* This is the entry point method. 
*/ 
public void onModuleLoad() { 
    Canvas canvas = Canvas.createIfSupported(); 
    final Context2d context2d = canvas.getContext2d(); 

    RootPanel.get("canvas").add(canvas); 
    Image img = new Image("face.png"); 
    final ImageElement face = ImageElement.as(img.getElement()); 
    img.addLoadHandler(new LoadHandler() { 

     @Override 
     public void onLoad(LoadEvent event) { 
      context2d.drawImage(face, 0, 0); 
     } 
    }); 
    //RootPanel.get("canvas").add(img); 
} 

이것은 내 코드입니다. 캔버스에 이미지를 그려야합니다. 마지막 줄이있는 경우 작동합니다.

RootPanel.get ("canvas"). add (img);

은 주석 처리되지 않았습니다.

줄을 주석 처리하면 이미지가로드되지 않는 것처럼 보입니다. 어떤 아이디어?

Answer 1

이미지를 WEB-INF 폴더에 두었습니까? 그것이 GWT가 이미지를로드하는 곳입니다. 일반적으로 "images/face.png"로로드 할 수 있도록 "images"폴더를 만드는 것이 좋습니다.

Answer 2

이미지 로더 (예 : http://code.google.com/p/google-web-toolkit-incubator/wiki/ImageLoader)를 사용할 수 있습니다.

Answer 3

이미지로드를 트리거하려면 이미지 위젯을 페이지에 추가해야합니다. 그냥 보이지 않게하십시오 :

public void onModuleLoad() {  
    Canvas canvas = Canvas.createIfSupported(); 
    final Context2d context2d = canvas.getContext2d(); 

    RootPanel.get().add(canvas); 
    Image img = new Image("face.png"); 
    final ImageElement face = ImageElement.as(img.getElement()); 
    img.addLoadHandler(new LoadHandler() { 

     @Override 
     public void onLoad(LoadEvent event) { 
      context2d.drawImage(face, 0, 0); 
     } 
    }); 

    img.setVisible(false); 
    RootPanel.get().add(img); 
}