Transizioni
Scopri gli effetti di transizione integrati in Pixi’VN per mostrare e rimuovere i componenti del canvas, comprese le transizioni dissolve, fade, move, push e zoom. Scopri come personalizzare o creare le tue transizioni per effetti visivi avanzati nel flusso del tuo gioco.
Pixi’VN offre vari effetti di transizione per mostrare o rimuovere un componente del canvas, oltre alla possibilità di creare le tue transizioni.
Funzionalità personalizzate
Il team di Pixi’VN accoglie con favore nuove proposte e contributi per rendere questa libreria ancora più completa. Sentiti libero di condividere o proporre la tua transizione nella chat qui sotto!
Creare la tua transizione è semplice: usa canvas.animate per definire effetti personalizzati.
To help you get started, here is a simplified version of transitions.showWithDissolve:
import { canvas, ImageSprite, UPDATE_PRIORITY } from "@drincs/pixi-vn";
import { AnimationOptions } from "@drincs/pixi-vn/motion";
export default async function showWithDissolve(
alias: string,
component: ImageSprite,
props: AnimationOptions = {},
priority?: UPDATE_PRIORITY,
): Promise<string[] | undefined> {
let { completeOnContinue = true, ...options } = props;
// add the new component
canvas.add(alias, component);
// edit the properties of the new component
component.alpha = 0;
// create the ticker and play it
let id = canvas.animate(
alias,
{
alpha: 1,
},
{
...options,
completeOnContinue,
},
priority,
);
// load the image if the image is not loaded
if (component.haveEmptyTexture) {
await component.load();
}
// return the ids of the tickers
if (id) {
return [id];
}
}Sostituire o rimuovere il componente precedente
Se esiste già un componente con lo stesso alias, puoi lasciare che venga sostituito, oppure: