Curved line tween

[fitness23]

I know I can tween along an array of co-ordinates, but is there anyway I can tween along a curved line? I'm looking for a traditional Phaser tween, not the type described here = http://phaser.io/tutorials/coding-tips-008

Could I build the co-ordinates somehow using something like this =http://www.w3schools.com/tags/canvas_beziercurveto.asp

[Tom Atom]

You can create your own easing functions and use them in tween. Easing function is taking one paramater - progress from 0 to 1 and returns one number, usually in 0 -1 range (but you can do fun things when returning other values)

Standard Phaser easing linear function looks like this:

function ( k ) {
  return k;
}

 For returning point on curve you will need more than one input parameter. Some time I wrote blog post (http://sbcgamesdev.blogspot.cz/2015/05/phaser-tutorial-dronshooter-simple-game_9.html) for making simple game, where I am using wiggle function to do nice and smooth random movement for enemies. Function looks like this:

function wiggle(aProgress: number, aPeriod1: number, aPeriod2: number): number {
    var current1: number = aProgress * Math.PI * 2 * aPeriod1;
    var current2: number = aProgress * Math.PI * 2 * aPeriod2;

    return Math.sin(current1) * Math.cos(current2);
}

 And in tween it is used like this (only wiggle along x axis):

        // random movement range
        var range: number = this.game.rnd.between(60, 120);
        // random duration of complete move
        var duration: number = this.game.rnd.between(30000, 50000);
        // random parameters for wiggle easing function
        var xPeriod1: number = this.game.rnd.between(2, 13);
        var xPeriod2: number = this.game.rnd.between(2, 13);

        // set tweens for horizontal and vertical movement
        var xTween = this.game.add.tween(this.body)
        xTween.to({ x: this.position.x + range }, duration, function (aProgress: number) {
            return wiggle(aProgress, xPeriod1, xPeriod2);
        }, true, 0, -1);

 In fact, wiggle function does all the calculations inside simple one-parameter/one-return value wrapper in tween.

 For bezier (catmull-rom) curves you will have to pass 4 parameters for segment points positions and one for actual progress along curve segment. You will have to call tween for x and y separately (see that blog post).

 Solution I described solves move along 1 segment of curved line. But I believe, you can extend it to move along longer one - you will have to add some logic to feed your calculation function with new paramaters.

[drhayes]

Defining your own tweening function is something like a Phaser superpower -- such a great idea to fine tune what you get out.