这是我对GWT和HTML5 Canvas的第一个实验。 我的第一个尝试是创建矩形,仅用几行代码就得出了这样的内容:
GWT和HTML5 Canvas演示

码:

 

public class GwtHtml5 implements EntryPoint {
 
 static final String canvasHolderId = "canvasholder";
 static final String unsupportedBrowser = "Your browser does not support the HTML5 Canvas";
 static final int height = 400;
 static final int width = 500;
 final CssColor colorRed = CssColor.make("red");
 final CssColor colorGreen = CssColor.make("green");
 final CssColor colorBlue = CssColor.make("blue");
 Canvas canvas;
 Context2d context;
 
 
 public void onModuleLoad() {
  canvas = Canvas.createIfSupported();
  if (canvas == null) {
        RootPanel.get(canvasHolderId).add(new Label(unsupportedBrowser));
        return;
  }
  createCanvas();
 }
 
 private void createCanvas(){
  
     canvas.setWidth(width + "px");
     canvas.setHeight(height + "px");
     canvas.setCoordinateSpaceWidth(width);
     canvas.setCoordinateSpaceHeight(height);
     
     RootPanel.get(canvasHolderId).add(canvas);
     
     context = canvas.getContext2d();
     
     context.beginPath();
     context.setFillStyle(colorRed);
     context.fillRect(100, 50, 100, 100);
     context.setFillStyle(colorGreen);
     context.fillRect(200, 150, 100, 100);
     context.setFillStyle(colorBlue);
     context.fillRect(300, 250, 100, 100);
     context.closePath();
     
 }
 
}

我的Spring Ball尝试了一些我在Web上找到的代码。

GWT和HTML5 Canvas演示
GWT和HTML5 Canvas演示

参考:来自GlyphSoft博客的JCG合作伙伴 Mark Anro Silva的GWT和HTML5 Canvas演示

翻译自: https://www.javacodegeeks.com/2012/05/gwt-and-html5-canvas-demo.html

相关文章: