Animations

NxGui has two animation layers. Both are interpolated by the client, so motion is smooth at any server TPS.

Try it — live playground

This is the editor's transform tool, running right here. Drag the button to move it, drag its corners to scale, drag the amber arm to rotate — or type exact values. Move the green/amber pivot dots to change where scaling and rotation happen from. Hit ▶ Play to watch the animation exactly as it'll run in game — the math is identical to the editor's.

The faint ghost is the resting pose; what you're dragging is the "after" state. In the editor this same tool lives in the inspector (hover / click) and inside the Animate logic node.

1 · Interaction animations (inspector)

Per-element hover and click micro-animations, authored in What it does → Animation. You pose the "after" state directly: drag the preview to move, drag corners to scale, pick separate 9-point pivots for scale and rotation, set duration and easing, and preview with ▶ Play. Hover reverses on exit; click layers on top of the hover pose. Use these for tactile UI feel — button lifts, tile zooms, press-downs.

2 · Logic-driven animations (Flow)

For anything triggered — opens, purchases, timers, reveals:

• Animate (canvas) — the same drag-to-pose editing embedded inside the node. Pick the element, pose its end state on the mini-canvas, choose duration + easing. Fire it from any trigger.
• Move / Scale / Rotate — numeric deltas via data pins: computed motion (e.g. slide a panel by an amount from a variable).
• Reset Transform — tween back to the authored pose; always end open-animations and loops with this to avoid drift.

Easing

Recipes

• Entrance: On Screen Open → Animate each panel from off-screen/scaled-down into place (stagger with Wait 0.1–0.3 s between chains).
• Pulse: Every X Seconds → Animate (scale 1.05, 300 ms) → Wait 0.35 → Reset Transform (300 ms).
• Purchase feedback: On Click → Play Sound + Animate (bounce) → Wait → Run Command.