Java CanvasElement类代码示例

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
private native boolean setFullscreenJSNI(GwtGraphics graphics, CanvasElement element) /*-{
	if (element.webkitRequestFullScreen) {
		element.width = $wnd.screen.width;
		element.height = $wnd.screen.height;
		element.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
		$doc
				.addEventListener(
						"webkitfullscreenchange",
						function() {
							[email protected]::fullscreenChanged()();
						}, false);
		return true;
	}
	if (element.mozRequestFullScreen) {
		element.width = $wnd.screen.width;
		element.height = $wnd.screen.height;
		element.mozRequestFullScreen();
		$doc
				.addEventListener(
						"mozfullscreenchange",
						function() {
							[email protected]::fullscreenChanged()();
						}, false);
		return true;
	}
	return false;
}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
/**
 * Returns a WebGL context for the given canvas element. Returns null if no 3d
 * context is available.
 */
public static native WebGLRenderingContext getContext(CanvasElement canvas, WebGLContextAttributes attributes) /*-{
  var names = ["webgl", "experimental-webgl", "moz-webgl", "webkit-webgl", "webkit-3d"];
  for (var i = 0; i < names.length; i++) {
    try {
      var ctx = canvas.getContext(names[i], attributes);
      if (ctx != null) {
        // Hook for the semi-standard WebGLDebugUtils script.
        if ($wnd.WebGLDebugUtils) {
          if ($wnd.console && $wnd.console.log) console.log('WebGL debugging enabled');
          return $wnd.WebGLDebugUtils.makeDebugContext(ctx);
        }
        return ctx;
      }
    } catch(e) {
    }
  }
  return null;
}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
/**
 * Creates a WebGL 1.0 context upon a canvas element using the specified context attributes. This method alerts the
 * user if there is no WebGL support and also redirects the browser to <a href="http://get.webgl.org/">get.webgl.org
 * </a>.
 *
 * @param canvas     The canvas element to creeate the context upon.
 * @param attributes The context attributes to request the context with.
 *
 * @return The created WebGL context object.
 */
public static native WebGLContext createContext(CanvasElement canvas, WebGLContext.Attributes attributes) /*-{
    try
    {
        if (attributes)
            $wnd.gl = canvas.getContext("webgl", attributes) || canvas.getContext("experimental-webgl", attributes);
        else
            $wnd.gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");

        $wnd.attribs = $wnd.gl.getContextAttributes();
        $wnd.glv = 1.0;
    }
    catch (e)
    {
        alert(e);

        $wnd.alert("Your browser doesn't appear to support WebGL. Try upgrading your browser.");
        $wnd.location.href = 'http://get.webgl.org/';
    }

    return $wnd.context = {
        gl: $wnd.gl,
        attribs: $wnd.attribs,
        glv: $wnd.glv
    };
}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
public static native WebGLContext createContext(CanvasElement canvas, WebGLContext.Attributes attributes) /*-{
    try
    {
        if (attributes)
            $wnd.gl = canvas.getContext("webgl2", attributes) || canvas.getContext("experimental-webgl2", attributes);
        else
            $wnd.gl = canvas.getContext("webgl2") || canvas.getContext("experimental-webgl2");

        $wnd.attribs = $wnd.gl.getContextAttributes();
        $wnd.glv = 2.0;
    }
    catch (e)
    {
        alert(e);

        $wnd.alert("Your browser doesn't appear to support WebGL 2. Try upgrading your browser.");
        $wnd.location.href = 'http://get.webgl.org/';
    }

    return $wnd.context = {
        gl: $wnd.gl,
        attribs: $wnd.attribs,
        glv: $wnd.glv
    };
}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
/**
 * Returns a WebGL context for the given canvas element. Returns null if no 3d
 * context is available.
 */
public static native WebGLRenderingContext getContext(CanvasElement canvas, WebGLContextAttributes attributes) /*-{
  var names = ["experimental-webgl", "webgl", "moz-webgl", "webkit-webgl", "webkit-3d"];
  for (var i = 0; i < names.length; i++) {
    try {
      var ctx = canvas.getContext(names[i], attributes);
      if (ctx != null) {
        // Hook for the semi-standard WebGLDebugUtils script.
        if ($wnd.WebGLDebugUtils) {
          if ($wnd.console && $wnd.console.log) console.log('WebGL debugging enabled');
          return $wnd.WebGLDebugUtils.makeDebugContext(ctx);
        }
        return ctx;
      }
    } catch(e) {
    }
  }
  return null;
}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
private CanvasElement prepareMissingTileImage() {
	int tileSize = DjvuContext.getTileSize();
	CanvasElement canvas = createImage(tileSize, tileSize);
	Context2d context2d = canvas.getContext2d();
	context2d.setFillStyle("white");
	context2d.fillRect(0, 0, canvas.getWidth(), canvas.getHeight());
	Image image = new Image();
	final ImageElement imageElement = image.getElement().cast();
	imageElement.getStyle().setProperty("visibility", "hidden");
	Event.setEventListener(imageElement, event -> {
		if (Event.ONLOAD == event.getTypeInt()) {
			missingTileImage.getContext2d().drawImage(imageElement, 0, 0);
			RootPanel.get().getElement().removeChild(imageElement);
		}
	});
	RootPanel.get().getElement().appendChild(imageElement);
	image.setUrl(getBlankImageUrl());
	return canvas;
}
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
public void setTile(TileInfo tileInfo, GMap bufferGMap) {
	if (bufferImageData == null || bufferImageData.getWidth() != bufferGMap.getDataWidth()
			|| bufferImageData.getHeight() != bufferGMap.getDataHeight()) {
		bufferImageData = bufferCanvas.getContext2d()
				.createImageData(bufferGMap.getDataWidth(), bufferGMap.getDataHeight());
	}
	Uint8Array imageArray = bufferImageData.getData().cast();
	imageArray.set(bufferGMap.getImageData());
	bufferCanvas.getContext2d().putImageData(bufferImageData, -bufferGMap.getBorder(), 0);

	CanvasElement tile = tiles.get(tileInfo);
	if (tile == null) {
		tile = createImage(bufferGMap.getDataWidth() - bufferGMap.getBorder(), bufferGMap.getDataHeight());
		tiles.put(new TileInfo(tileInfo), tile);
	}
	Context2d c = tile.getContext2d();
	c.setFillStyle("white");
	c.fillRect(0, 0, tileSize, tileSize);
	c.drawImage(bufferCanvas, 0, 0);
	for (Consumer<Integer> listener : tileListeners)
		listener.accept(tileInfo.page);
}
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
public static CanvasElement createImage(int width, int height) {
	Canvas canvas = Canvas.createIfSupported();
	canvas.setWidth(width + "px");
	canvas.setCoordinateSpaceWidth(width);
	canvas.setHeight(height + "px");
	canvas.setCoordinateSpaceHeight(height);
	return canvas.getCanvasElement();
}
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
private native boolean setFullscreenJSNI (GwtGraphics graphics, CanvasElement element) /*-{
if(element.webkitRequestFullScreen) {
element.width = $wnd.screen.width;
element.height = $wnd.screen.height;
element.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
$doc.addEventListener("webkitfullscreenchange", function() {
[email protected]::fullscreenChanged()();
}, false);
return true;
}
if(element.mozRequestFullScreen) {
element.width = $wnd.screen.width;
element.height = $wnd.screen.height;
element.mozRequestFullScreen();
$doc.addEventListener("mozfullscreenchange", function() {
[email protected]::fullscreenChanged()();
}, false);
return true;
}
return false;
}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
/** from https://github.com/toji/game-shim/blob/master/game-shim.js
 * @param element Canvas */
private native void setCursorCatchedJSNI (CanvasElement element) /*-{
	// Navigator pointer is not the right interface according to spec.
	// Here for backwards compatibility only
	if (!navigator.pointer) {
		navigator.pointer = navigator.webkitPointer || navigator.mozPointer;
	}
	// element.requestPointerLock
	if (!element.requestPointerLock) {
		element.requestPointerLock = (function() {
			return element.webkitRequestPointerLock
					|| element.mozRequestPointerLock || function() {
						if (navigator.pointer) {
							navigator.pointer.lock(element);
						}
					};
		})();
	}
	element.requestPointerLock();
}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
/** Returns a WebGL context for the given canvas element. Returns null if no 3d context is available. */
public static native WebGLRenderingContext getContext (CanvasElement canvas, WebGLContextAttributes attributes) /*-{
																																						var names = ["experimental-webgl", "webgl", "moz-webgl", "webkit-webgl", "webkit-3d"];
																																						for (var i = 0; i < names.length; i++) {
																																						try {
																																						var ctx = canvas.getContext(names[i], attributes);
																																						if (ctx != null) {
																																						// Hook for the semi-standard WebGLDebugUtils script.
																																						if ($wnd.WebGLDebugUtils) {
																																						if ($wnd.console && $wnd.console.log) console.log('WebGL debugging enabled');
																																						return $wnd.WebGLDebugUtils.makeDebugContext(ctx);
																																						}
																																						return ctx;
																																						}
																																						} catch(e) {
																																						}
																																						}
																																						return null;
																																						}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
/**
 * from https://github.com/toji/game-shim/blob/master/game-shim.js
 * 
 * @param element Canvas
 */
private native void setCursorCatchedJSNI(CanvasElement element) /*-{
	// Navigator pointer is not the right interface according to spec.
	// Here for backwards compatibility only
	if (!navigator.pointer) {
		navigator.pointer = navigator.webkitPointer || navigator.mozPointer;
	}
	// element.requestPointerLock
	if (!element.requestPointerLock) {
		element.requestPointerLock = (function() {
			return element.webkitRequestPointerLock
					|| element.mozRequestPointerLock || function() {
						if (navigator.pointer) {
							navigator.pointer.lock(element);
						}
					};
		})();
	}
	element.requestPointerLock();
}-*/;
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
/**
 * Animate zoom and tranlate on the HTML5 canvas, after the DisplayArea has zoomed in.
 * 
 * @param context
 * @param canvas_img
 * 			the CanvasElement of the canvas to be animated
 * @param cb
 * 			callback for when the animation completes
 * @param old_width
 * 			the width of the viewport before zoom
 * @param new_width
 * 			the width of the viewport after zoom, in the same coordinates as old_width
 * @param new_x
 * 			x coordinate of the new viewport center, relative to the HTML5 canvas 
 * 			in the browser
 * @param new_y
 * 			y coordinate of the new viewport center, relative to the HTML5 canvas
 * 			in the browser
 */
public ZoomAnimation(Context2d context, CanvasElement canvas_img,
		AnimationCallback cb, int old_width, int new_width, int new_x, int new_y) {
	this.context = context;
	
	Canvas buffer = Canvas.createIfSupported();
	Context2d buff_context = buffer.getContext2d();
	
	buffer.setPixelSize(canvas_img.getWidth(), canvas_img.getHeight());
	buffer.setCoordinateSpaceWidth(canvas_img.getWidth());
	buffer.setCoordinateSpaceHeight(canvas_img.getHeight());
	
	buff_context.drawImage(canvas_img, 0, 0);
	
	this.canvas_img = buff_context.getCanvas();
	
	scale = (double) old_width / new_width;
	
	this.width_from = canvas_img.getWidth();
	this.height_from = canvas_img.getHeight();
	
	this.x_from = width_from / 2;
	this.y_from = height_from / 2;
	
	this.x_to = new_x;
	this.y_to = new_y;
	
	this.cb = cb;
}
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
private void addAreaClickListener(final ColorfillAreaClickListener listener) {
    interactionHandlerFactory.applyUserClickHandler(new Command() {

        @Override
        public void execute(NativeEvent event) {
            event.preventDefault();
            CanvasElement canvasElement = canvasStubView.getCanvas().getCanvasElement();
            Area area = new Area(positionHelper.getXPositionRelativeToTarget(event, canvasElement), positionHelper.getYPositionRelativeToTarget(event,
                    canvasElement));
            if (area.getX() >= 0 && area.getY() >= 0) {
                listener.onAreaClick(area);
            }
        }
    }, canvasStubView.getCanvas());
}
 

import com.google.gwt.dom.client.CanvasElement; //导入依赖的package包/类
public void onModuleLoad() {
    canvas = Canvas.createIfSupported();
    if (canvas == null) {
        Window.alert("Canvas not supported");
        return;
    }
    RootPanel.get("screen").add(canvas);

    CanvasElement el = canvas.getCanvasElement();
    el.setWidth(960);
    el.setHeight(540);

    Context2d ctx = canvas.getContext2d();
    setupContext(ctx);
    ctx.scale(3, 3);

    RootPanel.get().addDomHandler(this, KeyDownEvent.getType());

    font = new Image("images/font.png");
    fontElement = ImageElement.as(font.getElement());

    audio = Audio.createIfSupported();

    game = new Game(this);
    game.pushState(new WelcomeState(game));

    new Timer() {
        @Override
        public void run() {
            game.handleEvent();
            game.update();
            game.draw();
        }
    }.scheduleRepeating(50);
}