How to get the width of an image in playn with HTML5 before rendering?

Question

In the pure Java version, calling width() or height() on Image or on ImageLayer works. But with HTML5 backend I get zero if I call it too early.

Image image = assets().getImage("images/myimage.png"); 
ImageLayer layer = graphics().createImageLayer(image);
float w1 = image.width(); 
float w2 = layer.width();

I tried right after the getImage() in the initialization code of the game and also from the paint() method, the first time paint() is called. But I always get zero with the HTML5 backend (Chrome, MacOs). However, if I call width() after the second call to the paint() method I get the correct width. So it seems that with the HTML5 backend the semantics is different: the width() method returns the correct width of an image / layer after it has been rendered a first time.

Is my interpretation correct and how to get the size before rendering?

score 1 · Answer 1 · answered Jun 09 '12 at 18:16

The Asset Watcher is working well. Alternatively, you can add a callback to your image. When the image is loaded a 'done' function is called.

Taken from pea.java:

// Add a callback for when the image loads.
// This is necessary because we can't use the width/height (to center the
// image) until after the image has been loaded
image.addCallback(new ResourceCallback<Image>() {
  @Override
  public void done(Image image) {
    layer.setOrigin(image.width() / 2f, image.height() / 2f);
    layer.setTranslation(x, y);
    peaLayer.add(layer);
  }


  @Override
  public void error(Throwable err) {
    log().error("Error loading image!", err);
  }
});

score 0 · Accepted Answer · answered May 01 '12 at 21:51

Have you tried using the AssetWatcher? It looks like those first width calls are outracing the document's ability to load the image.

Here's a simple example of the AssetWatcher in action:

http://playn-2011.appspot.com/slides/index.html#37

And here's an implementation of AssetWatcher from the PlayN Showcase sample:

http://code.google.com/p/playn-samples/source/browse/showcase/core/src/main/java/playn/showcase/core/sprites/SpriteLoader.java?#99

How to get the width of an image in playn with HTML5 before rendering?

2 Answers2