Jump to content

Sprite movement: moveToXY VS using Tween


Recommended Posts



This is question about moving sprites efficiently around. 


I will be moving a few sprites around. I was going to use moveToXY but docs say sprite does not stop moving after it reaches destination and also there is no callback on XY reached. Should i use tweens to move sprites or custom checking in update function if x and / or y are reached and than do my stuff.

Is there any other better approach? It seems redundant to keep creating tweens or am i wrong and they are in fact good and efficient way of moving sprites around.







Link to comment
Share on other sites

Well documentation states that "Note: The display object doesn't stop moving once it reaches the destination coordinates." And there is no callback like it is with tween. 


With sequence you mean that i chain function calls together? Like this oneThing().nextThing().thirdThing();


Ah, I think i understand.


I think this is all you want:

var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create });function preload() {    game.load.image('sprite', 'sprite.png');}function create() {    var sprite = game.add.sprite(100, 100, 'sprite');    var demoTween = game.add.tween(sprite).to({x:400,y:400},1000);    demoTween.onComplete.add(function(){        sprite.x = 100; sprite.y = 100;        demoTween.start();    });    demoTween.start();}

That creates a tween that moves to 400,400 over the duration of 1 second, then when it gets there the onComplete handler is fired, reseting the position and starting the tween again.

Link to comment
Share on other sites

@Serapth: Tnx  but this is not what i need. :)


I will have multiple sprites that will move to some x and y. On reaching destination they will have to wait some random amount of time (with animation changed to waiting) and then move to next destination.

And method moveToXY seems perfect for this except it has no callback that i need. I simply need to know if using tweens (they seem nice since i get a callback with the but i have a feeling they are not performant ) for such movement is efficient considering frame rate or is there any better way for moving sprites to set locations with callback on reaching that location. 

Link to comment
Share on other sites

moveToXY sets the velocity of an Arcade physics enabled body so that it moves towards the specified point. It does not try to stop the object, but it is a convenience function so that you don't have to do the maths to make an object move somewhere via velocity.


If you set body.moves to false, you can instead move the sprite by tweens which is highly performant, 100% accurate and will stop exactly where you tell it to. The drawback is that an object that uses physics for its movement relies on its velocity to interact with other physical objects, so collisions and so on get a bit weird. Also, if you try to move a physics-enabled Sprite without setting body.moves to false, you'll get all kinds of odd effects such as vibrating and warping as the two different systems fight over where the Sprite should be in any given frame.

Link to comment
Share on other sites

Perhaps I may be being a bit thick here, but I still don't get why you can't use Tweens.


Literally all a tween is is for transition between two values smoothly, and the events that correspond with doing so.  Tweens are light weight but also easily reused.  What exactly is it about them that makes it so you can use them?  You can fire a tween that moves you to a certain spot, use an onComplete handler for the tween to deal with when you get where you are going, then fire off a different tween, rinse and repeat.  You can also get updates as the tween occurs, in case you want to perform updates ( such as advancing animation frame ) while the tween is occurring.  You can also tween several values at once, or run several tweens in parallel or sequence.

Link to comment
Share on other sites


Tnx for great explanation. 



Perhaps I may be being a bit thick here


Do not sweat it man. I guess i did not formulate question as good as i could. 

Well i was merely trying to get information about using tweens and their performance for thing i am trying to do. Semantically speaking moveToXY is what i need but let us finish this debate now as it is getting out of hand. I will disable movement of body for physics sake and use tweens for moving my sprites around.

Link to comment
Share on other sites

  • 2 years later...

Just a quick one, is there any way to adjust the tween object so it moves to another point when it reaches the goal? It seems like just calling the "to" function again does nothing. Atm I am calling game.add.tween again for every time but it feels a bit like it could be not as efficient as it should?

Link to comment
Share on other sites

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.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

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