How to stop moveTo

[Hydromel]

Hello,

I'm trying to schedule 2 animations : first the boy goes out of the building, then he crosses the scene .

Here's my code :

var game = new Phaser.Game(1920,1088,Phaser.AUTO,'content',{preload: preload, create:create,update:update});var xmin=160;var ymin=160;var myPoint1 = new Phaser.Point(game.rnd.integerInRange(100, 200),game.rnd.integerInRange(ymin+60, ymin+80));var myPoint2 = new Phaser.Point(game.rnd.integerInRange(-100, 1800),game.rnd.integerInRange(ymin, 800));function preload(){game.load.image('map', 'assets/sky.png');game.load.image('building1', 'assets/building1.png');game.load.image('building12', 'assets/building2.png');game.load.spritesheet('boy','assets/boy_nb.png',22,23);}function create(){game.physics.startSystem(Phaser.Physics.ARCADE);game.add.sprite(0, 0, 'map');building1=game.add.sprite(xmin, ymin, 'building1');game.physics.arcade.enable(building1);building1.anchor.setTo (0.5,0.5);building1.body.immovable = true;building12=game.add.sprite(420, 420, 'building2');game.physics.arcade.enable(building12);building12.anchor.setTo (0.5,0.5);building12.body.immovable = true;boy=game.add.sprite(160,180,'boy');game.physics.arcade.enable(boy);//boy.anchor.setTo (0.5,0.5);boy.animations.add('walk',[3,4,5],10,true);boy.animations.add('up',[0,1,2],10,true);boy.animations.add('down',[6,7,8],10,true);boy.frame=7;boy.body.velocity.x = game.rnd.integerInRange(-100, 100);boy.body.velocity.y = game.rnd.integerInRange(-100, 100);}function update(){game.physics.arcade.collide(boy, building1);game.physics.arcade.collide(boy, building12);game.physics.arcade.moveToObject(boy,myPoint1,60,0);boy.animations.play('down');if (Phaser.Point.distance(myPoint1, boy) < 1){	//alert('test condition');        game.physics.arcade.moveToObject(boy,myPoint2,60,0);	boy.animations.play('walk');}}

But the animation does'nt change even the condition is true. Maybe I have to stop the first moveTo ? but how ? Thank you for your help !

[lewster32]

All moveTo does is set the velocity such that the object reaches the target in a specified period of time. To stop the object moving you just have to zero the object's velocity with body.velocity.setTo(0, 0) or similar. The reason your distance calculation isn't working I believe is because you're passing boy as the second parameter in Phaser.Point.distance when you should be passing boy.position instead.

 

For what it's worth, you'll probably get better results by setting body.moves = false and then using tweens to do this; they give you more control, they don't overshoot their targets and you can chain them to create more complex animation sequences.

[Hydromel]

Thanks a lot, I will try all this

[Hydromel]

I tried to use tweens with this example but the boy have shaking movements even if animations are disactivated (idem with velocity). Do you see what is wrong ?

var game = new Phaser.Game(1920,1088,Phaser.AUTO,'content',{preload: preload, create:create,update:update});var xmin=160;var ymin=160;var myPoint1 = new Phaser.Point(game.rnd.integerInRange(100, 200),game.rnd.integerInRange(ymin+60, ymin+80));var myPoint2 = new Phaser.Point(game.rnd.integerInRange(-100, 1800),game.rnd.integerInRange(ymin, 800));var boy;var sortieBoy;var s;function preload(){game.load.image('map', 'assets/sky.png');game.load.image('building1', 'assets/building1.png');game.load.image('building12', 'assets/building2.png');game.load.spritesheet('boy','assets/boy_nb.png',22,23);}function create(){game.physics.startSystem(Phaser.Physics.ARCADE);game.add.sprite(0, 0, 'map');building1=game.add.sprite(xmin, ymin, 'building1');game.physics.arcade.enable(building1);building1.anchor.setTo (0.5,0.5);building1.body.immovable = true;building12=game.add.sprite(420, 420, 'building2');game.physics.arcade.enable(building12);building12.anchor.setTo (0.5,0.5);building12.body.immovable = true;boy=game.add.sprite(160,180,'boy');game.physics.arcade.enable(boy);//boy.anchor.setTo (0.5,0.5);boy.animations.add('walk',[3,4,5],10,true);boy.animations.add('up',[0,1,2],10,true);boy.animations.add('down',[6,7,8],10,true);boy.frame=7;//boy.animations.play('descent');boy.body.velocity.x = game.rnd.integerInRange(-100, 100);boy.body.velocity.y = game.rnd.integerInRange(-100, 100);sortieBoy = game.add.tween(boy);    sortieBoy.to({x: myPoint1.x, y: myPoint1.y}, 1000, Phaser.Easing.Linear.None);sortieBoy.onComplete.add(firstTween, this);sortieBoy.start();}function firstTween() {    s = game.add.tween(boy);    s.to({x: myPoint2.x, y: myPoint2.y}, 1000, Phaser.Easing.Linear.None);    s.start();    //boy.animations.play('marche');}function update(){game.physics.arcade.collide(boy, bu_sante);game.physics.arcade.collide(boy, bu_sante2);}

Thanks for your help

[lewster32]

When tweening physics enabled sprites, you must set body.moves = false otherwise the physics system will 'fight' with the tween over who gets to set the position, and the result will be the shaking you see. Use onComplete to set body.moves to true when you're done tweening and physics will take over again.

[Hydromel]

Ok, but then how to tween the boy walking with sprite animation if body.moves = false ?

[lewster32]

The animation will still play - body.moves specifically refers to the physics engine's influence on the position of the object. The object can still move via setting its x and y position, animate and so on, but velocity and gravity will not affect it.

[Elgan]

curiously how to stop a tween if the object is destroyed?

 

[lewster32]

Check for any tweens on the object and stop them first before destroying it I guess

[Elgan]

how do i check, get list of tweens?

 

and how to stop them? hehe sorry

[lewster32]

Something like this:

function stopTweensFor(obj) {  // first get all of the active tweens  var tweens = game.tweens.getAll();  // filter that down to an array of all tweens of the specified object  var currentTweens = tweens.filter(function(tween) {    return tween._object === obj;  });  // if we have any matching tweens for the object, cycle through all of them and stop them  if (currentTweens.length > 0) {    for (var t = 0, len = currentTweens.length; t < len; t++) {      currentTweens[t].stop();    }  }}

Though the ability to get all tweens for an object probably should be a feature of TweenManager so you can just do the following (this won't work yet but I'll probably submit a PR to add it):

var objectTweens = game.tween.getAllFor(object);objectTweens.forEach(function(o) { o.stop(); });

[Hydromel]

No problem with animation, the tween can be combine with animation, thanks a lot !

But what about obstacles and collisions ? If velocity and gravity can't affect the boy, he can't get around the buildings ? even with :

game.physics.startSystem(Phaser.Physics.ARCADE);(...)game.physics.arcade.enable(building1);(...)game.physics.arcade.enable(building2);(...)game.physics.arcade.enable(boy);(...)game.physics.arcade.collide(boy, building1);game.physics.arcade.collide(boy, building2);

[lewster32]

If you're tweening you don't care about collisions, as you have complete control over the object. As soon as you stop tweening and want to have physics affect your player, just return body.moves to true.

[berna]

no tween
 

update:

var dist=game.physics.arcade.distanceToXY(player, playerPos.x , playerPos.y);
								             
if ( (Math.round(dist)>=-1 && Math.round(dist)<=1) || playerMoving == false) 
{
 player.body.velocity.x=0;
 player.body.velocity.y=0;
 playerMoving = false;
}
else{
  game.physics.arcade.moveToXY(player, playerPos.x , playerPos.y, 150);
}

 

[damien leroux]

I had the same issue. If that can help anyone in the future,  I created a plugin with functions that move objects to an exact position: https://github.com/damienleroux/phaser-move-and-stop-plugin

[samme]

Arcade.Body#moveTo is supposed to stop the Body once the movement is complete.