Jump to content

How to use optimized animations in Phaser?


Recommended Posts

Hello, guys. 


I think that this question is often asked by developers who want to minimize the size of images to be loaded by users


So, the question is: how to use optimized animation in Phaser?


At first I had about 100 pictures of a NPC animation and it was like (businnessMan in attachment)


But then I saw that the one of the NPCs picture pack weights about 15mb and I was shocked, so I decided to make only one MAIN picture and create another 99 like this (HumanGov0 in attachment)


But I couldn't use that at all, I tried to do that smth like this



for(var i = 0; i <= 100; i++) {                if(i < 10) {                    loader.image('man' + i, 'img/government/NPC/businessMan/HumanGov0_00' + i + '.png');                }                if(i >= 10 && i < 100) {                    loader.image('man' + i, 'img/government/NPC/businessMan/HumanGov0_0' + i + '.png');                }                if(i == 100) {                    loader.image('man' + i, 'img/government/NPC/businessMan/HumanGov0_' + i + '.png');                }            }

Usage (myObject = this)

var ind = 0;            setInterval(function() {                if(ind > 100) {                    ind = 0;                }                myObject.animArray.push(myObject.createImage(windowMain.x , windowMain.y + 30, 'man' + ind));                ind++;                console.log(ind)            }, 500);

And I event can't see that images at all (coordinates are set in a right place, I can images set there)


Maybe there is a better way to use that? Maybe a Phaser's method exists or smth?


Thank you very much and good luck)



Link to comment
Share on other sites


  • Recently Browsing   0 members

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