Tween

Container for the Tween animation system.

Type	Name	Interface Description
Variables	tweenAnimation: TweenAnimation	• Function: The internal animation object — the only config entry point. Cast based on tweenType: - Transform → TweenTransform (startVector3, endVector3, offsetVector3...) - TransformPath → TweenTransformPath (pointsPathVector3, durations, orientation...) - TransformFollow → TweenTransformFollow (followTarget, startVector3...) - Material → TweenMaterial (startColor, endColor, startVector2...) All inherit duration, delay, playMode, easingFunction, easingType, object, targetType, motionType, start/pause/resume/stop from TweenAnimation.
Variables	tweenType: TweenType	• Function: Gets the type of tween animation. Changing this property recreates the internal animation object. Use TweenType.Transform for position/rotation/scale, TweenType.TransformPath for path-based animation, TweenType.TransformFollow for following a target, or TweenType.Material for material property animation. Returns The tween type.
Functions	constructor()

Examples

constructor()

let obj = new APJS.Tween();

Use Case

Example 1 — Scale bounce animation on tap — object pops up to 1.5x then settles back using Tween component with PingPongOnce

@component()
export class TweenScaleBounce extends APJS.BasicScriptComponent {
  private tween!: APJS.Tween;
  private touchCallback!: (event: APJS.IEvent) => void;

  onStart(): void {
    this.tween = this.getSceneObject().getComponent("Tween") as APJS.Tween;

    this.touchCallback = (event: APJS.IEvent) => {
      const touch = event.args[0] as APJS.TouchData;
      if (touch.phase === APJS.TouchPhase.Began) {
        this.playBounce();
      }
    };
    APJS.EventManager.getGlobalEmitter().on(APJS.EventType.Touch, this.touchCallback, this);
  }

  private playBounce(): void {
    if (!this.tween) return;
    // Default tweenType is TransformPath — use TweenTransformPath API
    const anim = this.tween.tweenAnimation as APJS.TweenTransformPath;
    anim.targetType = APJS.TweenTargetType.Scale;
    anim.pointsPathVector3 = [
      new APJS.Vector3f(1, 1, 1),
      new APJS.Vector3f(1.5, 1.5, 1.5),
    ];
    anim.durations = [0.4];
    anim.fixedDuration = true;
    anim.pathType = APJS.TweenPathType.Straight;
    anim.easingFunction = APJS.TweenEasingFunction.Back;
    anim.easingType = APJS.TweenEasingType.Out;
    anim.playMode = APJS.TweenPlayMode.PingPongOnce;
    anim.start();
  }

  onDestroy(): void {
    APJS.EventManager.getGlobalEmitter().off(APJS.EventType.Touch, this.touchCallback, this);
  }
}

Example 2 — Score fly-up animation — show '+10' text that rises and fades on each tap, using manual tween in onUpdate

@component()
export class ScoreFlyUp extends APJS.BasicScriptComponent {
  @serializeProperty
  flyText!: APJS.SceneObject;

  private isFlying = false;
  private flyProgress = 0;
  private flyStartY = 0;
  private score = 0;
  private touchCallback!: (event: APJS.IEvent) => void;

  onStart(): void {
    this.flyText.visible = false;

    this.touchCallback = (event: APJS.IEvent) => {
      const touch = event.args[0] as APJS.TouchData;
      if (touch.phase === APJS.TouchPhase.Began) {
        this.score += 10;
        const screenY = (0.5 - touch.position.y) * 1280;
        this.showFlyUp("+10", screenY);
      }
    };
    APJS.EventManager.getGlobalEmitter().on(APJS.EventType.Touch, this.touchCallback, this);
  }

  private showFlyUp(text: string, startY: number): void {
    this.flyText.visible = true;
    const textComp = this.flyText.getComponent("Text") as APJS.Text;
    textComp.text = text;
    const st = this.flyText.getComponent("ScreenTransform") as APJS.ScreenTransform;
    st.anchoredPosition = new APJS.Vector2f(0, startY);
    st.scale = new APJS.Vector2f(1, 1);
    this.flyStartY = startY;
    this.flyProgress = 0;
    this.isFlying = true;
  }

  onUpdate(dt: number): void {
    if (!this.isFlying) return;
    this.flyProgress += dt / 1.0; // 1 second duration
    if (this.flyProgress >= 1) {
      this.flyText.visible = false;
      this.isFlying = false;
      return;
    }
    const st = this.flyText.getComponent("ScreenTransform") as APJS.ScreenTransform;
    st.anchoredPosition = new APJS.Vector2f(0, this.flyStartY + this.flyProgress * 120);
    const s = 1 - this.flyProgress * 0.5;
    st.scale = new APJS.Vector2f(s, s);
  }

  onDestroy(): void {
    APJS.EventManager.getGlobalEmitter().off(APJS.EventType.Touch, this.touchCallback, this);
  }
}