LogicaLinsanity Posted January 25, 2016 Share Posted January 25, 2016 Wondering how to get my networked sprites to "smoothly" move when their position is updated from the server. This function is called up to 10 times per second and provides the updated position of the remote player. Right now they kind of "jump" from position to position and I'd like to have a tween going to smooth it out. here's what it looks like: public Update(name: string, x: number, y: number) { var remotePlayer = this.remotePlayers[name]; var tween = this._game.add.tween(remotePlayer).to({ x: x, y: y }, 1000, Phaser.Easing.Linear, false); tween.interpolation(Phaser.Math.catmullRomInterpolation); tween.start(); //this.remotePlayers[name].position.x = x; //this.remotePlayers[name].position.y = y; } You can see in the commented code where I previously just set the remote players position directly. P.S. I'm only doing the catmullRomInterpolation based on what I saw in the phaser examples for tweens. thought it looked cool, but not sure if I am doing it right. Link to comment Share on other sites More sharing options...
icp Posted January 25, 2016 Share Posted January 25, 2016 Try this code: this._game.tween.frameBased = true; Link to comment Share on other sites More sharing options...
LogicaLinsanity Posted January 25, 2016 Author Share Posted January 25, 2016 1 hour ago, icp said: Try this code: this._game.tween.frameBased = true; If I do that, do I have to change my "1000" parameter (which is the miliseconds for the tween) to equal the amount of frames of the animation of the sprite? I'm a bit unsure on how framebased works, but it seems like that would cause some funky looking animation as this function gets called every few milliseconds to get the updated position from the server. I'll try it when I get back home though! Link to comment Share on other sites More sharing options...
LogicaLinsanity Posted January 25, 2016 Author Share Posted January 25, 2016 So the frameBased property set didn't help, but I got it working by removing the "Phaser.Easing.Linear" and the autostart boolean. so now my call is just: var tween = this._game.add.tween(remotePlayer).to({ x: x, y: y }, 1000); tween.interpolation(Phaser.Math.catmullRomInterpolation); tween.start(); it seems REALLLLY slow. like the player kind of "gradually" moves to the final position or something. but that may be catmullrom vs linear interpolation? Or maybe that's just how it should be for an online game since there's server calls involved behind the scenes. Link to comment Share on other sites More sharing options...
drhayes Posted January 26, 2016 Share Posted January 26, 2016 That 1000 is the number of ms of the tween. If you want it to go faster, you can shrink that number. Link to comment Share on other sites More sharing options...
Recommended Posts