melonjs
    Preparing search index...

    Class Tween

    Javascript Tweening Engine

    Super simple, fast and easy to use tweening engine which incorporates optimised Robert Penner's equation

    https://github.com/sole/Tween.js

    author sole / http://soledadpenades.com
    author mr.doob / http://mrdoob.com
    author Robert Eisele / http://www.xarg.org
    author Philippe / http://philippe.elsass.me
    author Robert Penner / http://www.robertpenner.com/easing_terms_of_use.html
    author Paul Lewis / http://www.aerotwist.com/
    author lechecacharro
    author Josh Faul / http://jocafa.com/

    Index

    Constructors

    constructor

    Properties

    _chainedTweens _delayTime _duration _easingFunction _interpolationFunction _object _onCompleteCallback _onStartCallback _onStartCallbackFired _onUpdateCallback _repeat _reversed _startTime _tweenTimeTracker _valuesEnd _valuesStart _valuesStartRepeat _yoyo isPersistent isRenderable updateWhenPaused

    Accessors

    Easing Interpolation

    Methods

    chain delay easing interpolation onComplete onStart onUpdate repeat start stop to yoyo

    Constructors

    • Parameters

      • object: object

        object on which to apply the tween

      Returns Tween

      // add a tween to change the object pos.x and pos.y variable to 200 in 3 seconds
      tween = new me.Tween(myObject.pos).to({
            x: 200,
            y: 200,
         }, {
            duration: 3000,
            easing: me.Tween.Easing.Bounce.Out,
            autoStart : true
      }).onComplete(myFunc);

    Properties

    _chainedTweens

    _chainedTweens: Tween[]

    _delayTime

    _delayTime: number

    _duration

    _duration: number

    _easingFunction

    _easingFunction: EasingFunction

    _interpolationFunction

    _interpolationFunction: InterpolationFunction

    _object

    _object: object

    _onCompleteCallback

    _onCompleteCallback: OnCompleteCallback<object> | null

    _onStartCallback

    _onStartCallback: OnStartCallback<object> | null

    _onStartCallbackFired

    _onStartCallbackFired: boolean

    _onUpdateCallback

    _onUpdateCallback: OnUpdateCallback<object> | null

    _repeat

    _repeat: number

    _reversed

    _reversed: boolean

    _startTime

    _startTime: number | null

    _tweenTimeTracker

    _tweenTimeTracker: number

    _valuesEnd

    _valuesEnd: Record<string, unknown>

    _valuesStart

    _valuesStart: Record<string, unknown>

    _valuesStartRepeat

    _valuesStartRepeat: Record<string, unknown>

    _yoyo

    _yoyo: boolean
    isPersistent: boolean
    isRenderable: boolean
    updateWhenPaused: boolean

    Accessors

    • get Easing(): {
          Back: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Bounce: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Circular: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Cubic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Elastic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Exponential: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Linear: { None: (k: number) => number };
          Quadratic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Quartic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Quintic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Sinusoidal: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
      }

      Returns {
          Back: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Bounce: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Circular: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Cubic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Elastic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Exponential: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Linear: { None: (k: number) => number };
          Quadratic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Quartic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Quintic: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
          Sinusoidal: {
              In: (k: number) => number;
              InOut: (k: number) => number;
              Out: (k: number) => number;
          };
      }

    • get Interpolation(): {
          Bezier: (v: number[], k: number) => number;
          CatmullRom: (v: number[], k: number) => number;
          Linear: (v: number[], k: number) => number;
      }

      Returns {
          Bezier: (v: number[], k: number) => number;
          CatmullRom: (v: number[], k: number) => number;
          Linear: (v: number[], k: number) => number;
      }

    Methods

    • object properties to be updated and duration

      Parameters

      • properties: Record<string, unknown>

        hash of properties

      • Optionaloptions: {
            autoStart?: boolean;
            delay?: number;
            duration?: number;
            easing?: EasingFunction;
            interpolation?: InterpolationFunction;
            repeat?: number;
            yoyo?: boolean;
        }

        object of tween properties, or a duration if a numeric value is passed

        • OptionalautoStart?: boolean

          allow this tween to start automatically. Otherwise call me.Tween.start().

        • Optionaldelay?: number

          delay amount expressed in milliseconds

        • Optionalduration?: number

          tween duration

        • Optionaleasing?: EasingFunction

          easing function

        • Optionalinterpolation?: InterpolationFunction

          interpolation function

        • Optionalrepeat?: number

          amount of times the tween should be repeated

        • Optionalyoyo?: boolean

          allows the tween to bounce back to their original value when finished. To be used together with repeat to create endless loops.

      Returns Tween

      this instance for object chaining

    • Allows the tween to bounce back to their original value when finished. To be used together with repeat to create endless loops.

      Parameters

      • yoyo: boolean

        flag

      Returns Tween

      this instance for object chaining

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Accessors
    Methods