GWT: 標準ライブラリのHTML5Canvasを利用する ～UiBinder編～

GWTでHTML5Canvasを利用するのであれば、UiBinderを利用するとラクになります。

Inheritsの設定

<inherits name="com.google.gwt.canvas.Canvas">

と書きます。

UiBinderの書き方

xmlns:c="urn:import:com.google.gwt.canvas.client"
 <c:Canvas ui:field="canvas"/>

と書きます。

Javaファイルの書き方
ここはいくつか注意事項があります。

@UiField(provided = true)
Canvas canvas;
public MyCanvas() {
 canvas = Canvas.createIfSupported();
 initWidget(uiBinder.createAndBindUi(this));

 canvas.setWidth("800px");
 canvas.setHeight("800px"); 
 canvas.setCoordinateSpaceWidth(400);
 canvas.setCoordinateSpaceHeight(600);
}

上記を見てもらうとわかりますが、

• @UifFieldのところに、(provided = true)が必要
• canvas = Canvas.createIfSupported()の処理が必要で、さらにそれは initWidgetの前にしなければならない

ということです。

以上で、普通にCanvasを利用できます。イベント処理も楽になるのではないでしょうか。