canvas - PlayN 中的像素级图形

Question

我想在主要目标是 HTML5 的 PlayN 游戏上做像素级图形。但是，PlayN 的Canvas对象不提供对CanvasPixelArray类或putImageData和getImageData函数的访问。我担心drawPoint每个像素的使用会很慢；有更好的方法吗？

Answer 1

PlayN 目前没有像素操作 API。

如果您只想针对 HTML5，您可以使用 GWT 方法创建和操作 ImageData 对象，然后通过我最近添加的用于转换图像的机制将它们注入 PlayN。

// use this canvas and context to create as many image data objects as you want
CanvasElement canvas = Document.get().createElement("canvas").<CanvasElement>cast();
Context2d ctx = canvas.getContext2d();
final ImageData data = ctx.createImageData(width, height);
// push those pixels

// use this PlayN image as a factory for creating PlayN images from your ImageData objects
CanvasImage image = PlayN.graphics().createImage(1, 1); // dummy image
Image pixelImage = image.transform(new HtmlBitmapTransformer() {
  public ImageElement transform(ImageElement elem) {
    // we ignore the element passed in and just create a new CanvasElement
    // and draw our bitmap data on it
    CanvasElement canvas = Document.get().createElement("canvas").<CanvasElement>cast();
    canvas.setWidth(width);
    canvas.setHeight(height);
    canvas.getContext2d().putImageData(data, 0, 0);
    return canvas;
  }
});

这有点骇人听闻。在某个时候，我将添加一种机制来获取和操作图像的像素数据，该机制与支持它的后端一样快。