Jump to content

Phaser 2.4 - Dynamic adding background animation


Recommended Posts

Hi all, I have this problem.


I have to create a background animation using about 40 jpg. (backgroun1,jpg.....background40.jpg).

Each background image is large like a stage, so about 840 px.


I tried drawing on BitmapData but the size grows too much.


What is the correct way to create a standard animation adding each single frame after loading all images (back1...back40.jpg)?



for (var i=0; i< LOOP_FRAME_COUNT; i++){
  game.load.image(this.game.loopFrameNames, path + "loop/" + this.game.loopFrameNames);


Thanks in advance.

Link to comment
Share on other sites

is there no way you can simplify your backgrounds to use reusable elements eg Tiles, TileSprites, repeated symbols etc? 40 full sized images sounds like a lot to be throwing about. 


when you say animation do you mean the background is static but the frames change? you can try loadTexture but i don't know how fast it will be http://phaser.io/docs/2.4.4/Phaser.Component.LoadTexture.html#loadTexture . does not sound like a good idea 

Calling this method causes a WebGL texture update, so use sparingly or in low-intensity portions of your game, or if you know the new texture is already on the GPU.

have you thought about using video?

Link to comment
Share on other sites

* have simpler assets for mobile

* construct a scene out of smaller moving parts

* I think you can safely use a 2048x2048 texture ... that would presumably let you use 32 frames of  512x256 image without having to switch texture on the gpu.

* potentially use scanline overlay to compensate for using a lower resolution http://creativebits.org/files/horizontal.gif


the best solution depends on your design and target platforms


have a look here


Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...