Переходы
Узнайте о встроенных эффектах переходов в Pixi’VN для показа и удаления компонентов canvas, включая переходы растворения, затухания, перемещения, проталкивания и масштабирования. Узнайте, как настроить или создать собственные переходы для расширенных визуальных эффектов в ходе вашей игры.
Pixi’VN предоставляет различные эффекты переходов для показа или удаления компонента canvas, а также возможность создать собственные переходы.
Пользовательская функциональность
Команда Pixi’VN приветствует новые предложения и вклад, чтобы сделать эту библиотеку ещё более полной. Не стесняйтесь делиться или предлагать свой переход в чате ниже!
Создать собственный переход просто: используйте canvas.animate, чтобы определить пользовательские эффекты.
Чтобы помочь вам начать, вот упрощённая версия 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];
}
}Замена или удаление предыдущего компонента
Если компонент с таким же alias уже существует, вы можете разрешить его замену, либо: