Articulated animations

Articulated animations are functions that use the canvas.animate function to create animations that can be applied to canvas components. These functions are typically used to create effects like shaking, bouncing, or other complex animations that involve multiple steps or components.

Shake

The shakeEffect function is an articulated animation that shakes a component. This function has the following parameters:

• alias: The alias to identify the component.
• options (Optional): Animation options, matching the options of animate function. Proprietà aggiuntive:
  • shocksNumber (Optional): The number of shocks.
  • shakeType (Optional): The type of shake effect. Possible values are vertical and horizontal.
  • maxShockSize (Optional): The maximum size of the shock.
• priority (Opzionale): La priorità del ticker PixiJS. Questo parametro imposta la priorità del ticker. Il valore predefinito è UPDATE_PRIORITY.NORMAL.

import {
    CANVAS_APP_GAME_LAYER_ALIAS,
    newLabel,
    shakeEffect,
    showImage,
} from "@drincs/pixi-vn";

export const startLabel = newLabel("start", [
    async () => {
        await showImage("bg", "bg", { scale: 1.3 });
        await showImage("alien", "alien", { align: 0.5 });
        shakeEffect("alien"); 
    },
    async () => {
        shakeEffect(CANVAS_APP_GAME_LAYER_ALIAS); 
    },
]);