Load and add image in create()?

Phaser 3
1

Hi, i’m trying to load and add images in create().
It seems that I need to start the new load, so my code is :

this.load.image('sky', 'ASSETS/IMAGES/from_phaser/space3.png');
this.load.start();
this.add.image(width/2, height/2, 'sky');

As I can see in Chrome’s inspector the load worked, but the image isn’t displayed…
Why "this.add.image(width/2, height/2, ‘sky’); " doesn’t display anything or at least throw an error ?

2

Loading doesn’t happen instantly. Calling this.load.start will start the Loader and request the files through XHR, then parse them into textures. Only then can they actually be used; before the loading process finishes, the texture doesn’t exist, so the image will use the default fallback texture.

You should add your image after the Loader has finished, i.e. after it emits its COMPLETE event. If you need to use the image for something even before its texture has loaded, you could also create it without a texture, then set the texture after it has loaded. Of course, the cleanest alternative is to just load your image from the Scene’s preload method if possible.

1 Like