Question

在smartGWT中，可以在HTML5-canvas中添加另一个小部件（似乎使用界面），如this example中所示。

现在我想弄清楚，如果在（原始）GWT2.4中也可以这样做。有没有人使用GWT而没有任何其他项目（如smartGWT，gwtExt，extGWT，......）？

感谢您的所有答案。

Answer 1

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

Answer 2

感谢Erik，我注意到最近在GWT 2.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);
    }

}

Answer 4

您需要的是按钮的CSS样式。像这样的风格：

button {
    position:absolute;
    z-index:2;  
}

button.zoomOut {
    top:200px;
    left:265px;
    font-size: 30px;
    margin-left:auto;
    margin-right:auto;
}

button.zoomIn {
    top:200px;
    left:400px;
    font-size: 30px;
    margin-left:auto;
    margin-right:auto;
}

凭借绝对位置，您可以将它们放在屏幕上的任何位置。

干杯

在GWT中将小部件（按钮）添加到HTML5画布

4 个答案: