espace 25 Posted January 4, 2019 Report Share Posted January 4, 2019 hi, I would like to make a perpetual movement with my sprites to give the illusion of movement. In the snippet below , if the sprite are stars you will understand that for example a rocket move trough. The problem here is : on each movement i would like at the oncomplete function move the sprite randomely on Y but with repetition on -1 it don't works. How could i do to achieve that properly ? Thanks http://phaser.io/sandbox/edit/NaYAGwfv function create() { var sprite=[] var tw=[]; for (var i = 0; i < 5; i++) { sprite[i]=game.add.sprite(400+i*10, i*100, 'phaser'); } var move=()=>{ for (var i = 0; i < sprite.length; i++) { //-1 to have perpetual movement but the problem is that onComplete don't works tw[i]=game.add.tween(sprite[i]).to({x:-400},1000,Phaser.Easing.Linear.none,true,i*200) tw[i].onComplete.add(()=>{ //return to right to give the illusion of perpetual movement sprite[i].x=400; // move randomely on y sprite[i].y=Math.random(0,800); },this) } } move(); } Quote Link to post Share on other sites
b10b 226 Posted January 4, 2019 Report Share Posted January 4, 2019 @espace use onLoop instead of onComplete You won't need to reset the x, because the tween state will do that. Math.random(0,800) is incorrect, use Math.random() * 800 instead. Use a regular function (not an arrow) for the signal listener, and use sprite as the context (instead of this). Sorry, couldn't figure out why this scenario didn't fit as expected with arrows? function create() { var sprite=[] var tw=[]; for (var i = 0; i < 5; i++) { sprite[i]=game.add.sprite(400+i*10, i*100, 'phaser'); } var move=()=>{ for (var i = 0; i < 5; i++) { tw[i]=game.add.tween(sprite[i]).to({x:-400},1000,Phaser.Easing.Linear.none,true,i*200,-1); tw[i].onLoop.add(function(){ this.y = Math.random() * 800; },sprite[i]) } } move(); } espace 1 Quote Link to post Share on other sites
espace 25 Posted January 10, 2019 Author Report Share Posted January 10, 2019 hi again me ! thanks for your previous solution. I have another request that looks a lot like the first but I can not solve it. I would like to have random object in x first. Then i would like to move them and when they reach -400 in x (left outside the screen), their position is set to 2000 (right outside the screen). The problem is that i see the "restart effect". It's difficult to me to explain... look at this snippet, it's easier to understand https://phaser.io/sandbox/edit/NEkknTBO function create() { var sprite=[] var tw=[]; for (var i = 0; i < 5; i++) { sprite[i]=game.add.sprite(Math.random()*800, i*100, 'phaser'); } var move=()=>{ for (var i = 0; i < 5; i++) { tw[i]=game.add.tween(sprite[i]).to({x:-400},1000,Phaser.Easing.Linear.none,true,0,-1) tw[i].onLoop.add(function(){ //normally i must not see the sprite at the restart because it's outside the screen ? this.x=2000 this.y=Math.random()*800 },sprite[i]) } } move(); } Quote Link to post Share on other sites
espace 25 Posted January 10, 2019 Author Report Share Posted January 10, 2019 update nobody? Quote Link to post Share on other sites
Milton 124 Posted January 11, 2019 Report Share Posted January 11, 2019 Guess you should use onComplete and then create a new tween. Doesn't look like you can update position, see Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.