在GWT中向HTML5画布添加一个小部件(按钮)

Question

在smartGWT中，可以向HTML5-canvas添加另一个小部件(似乎使用了一个接口)，正如您在this example中看到的那样。

现在我想知道，这在(原始的) GWT2.4中是否也是可能的。你们中有没有人在没有任何额外项目(如smartGWT、gwtExt、extGWT等)的情况下使用GWT的工作示例？

谢谢你的回答。

Answer 1

HTML5画布还不在GWT的范围内，但是也许您可以使用GWT dom API在dom中构建que等效元素，并通过JSNI调用来绘制它。

Answer 2

多亏了Erik，我注意到了GWT2.4中最近发布的canvas

http://google-web-toolkit.googlecode.com/svn/javadoc/2.4/com/google/gwt/canvas/client/Canvas.html

Answer 3

据我所知，你不能把任意的部件放在画布上。你能做的就是绘制图像。所以我猜你最喜欢的smartGWT小部件就是图片。

如果你有一个GWT图像对象，这就是在画布中绘制它的方法：

import com.google.gwt.canvas.client.Canvas;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.dom.client.ImageElement;
import com.google.gwt.user.client.ui.Image;
import com.google.gwt.user.client.ui.RootLayoutPanel;

public class ImageCanvasTest implements EntryPoint {

    public void onModuleLoad() {
        Image image = new Image(
            "http://upload.wikimedia.org/wikipedia/en/f/f6/Gwt-logo.png");

        Canvas canvas = Canvas.createIfSupported();
        canvas.getContext2d().drawImage(
        ImageElement.as(image.getElement()), 0, 0);

        RootLayoutPanel.get().add(canvas);
    }

}