Gestione assets
Organizzazione, referenziazione e caricamento degli assets (immagini, suoni, video) in Pixi'VN utilizzando alias e manifests.
Per caricare e manipolare assets (immagini, gif, video, ecc.) sarà necessario utilizzare Assets. Assets è una classe con molte funzionalità e proviene dalla libreria PixiJS. Per maggiori informazioni, leggere qui.
In tutte le funzioni di Pixi'VN è possibile utilizzare direttamente l'URL dell'immagine, anche se non è definito in Assets.
let alien1 = await showImage("alien", "https://pixijs.com/assets/eggHead.png");Questo metodo presenta alcuni svantaggi:
- La modifica dell'URL di un asset da una versione all'altra potrebbe causare incompatibilità.
- Il giocatore dovrà attendere un breve tempo di caricamento ogni volta che preme "vai avanti" e viene avviato un
stepche utilizza assets. - Scrivere l'intero URL nel codice ne aumenterà la lunghezza e lo renderà meno leggibile.
Per questi motivi, si consiglia di gestire gli assets nei seguenti modi.
Inizializza la matrice degli assets all'avvio del progetto
L'inizializzazione della matrice degli assets all'inizio del progetto consente di fare riferimento agli assets tramite un alias univoco senza dover utilizzare l'URL/percorso. Utilizzando l'alias puoi modificare l'URL di una risorsa senza doverti preoccupare della compatibilità della versione.
Per fare ciò, si consiglia di creare una funzione asincrona defineAssets che verrà chiamata all'avvio del progetto.
Nella funzione defineAssets, usa Assets (ad esempio Assets.add, Assets.addBundle e Assets.init) per assegnare alias agli URL. Puoi trovare maggiori informazioni su di essi qui per assegnare un alias a ciascun asses.
import { Assets, sound } from "@drincs/pixi-vn";
import manifest from "../assets/manifest";
export async function defineAssets() {
// manifest
await Assets.init({ manifest });
// single asset
Assets.add({ alias: 'eggHead', src: "https://pixijs.com/assets/eggHead.png" })
Assets.add({ alias: 'flowerTop', src: "https://pixijs.com/assets/flowerTop.png" })
Assets.add({ alias: 'video', src: "https://pixijs.com/assets/video.mp4" })
sound.add('bird', 'https://pixijs.io/sound/examples/resources/bird.mp3');
sound.add('musical', 'https://pixijs.io/sound/examples/resources/musical.mp3');
// bundle
Assets.addBundle('liam', {
"liam-head": 'liam_head.png',
"liam-body": 'liam_body.png',
"liam-arms": 'liam_arms.png',
});
}Caricare gli assets
Per impostazione predefinita, gli assets vengono caricati solo quando necessario.
Tuttavia se gli assets non sono salvate localmente, bensì in un "hosting di assets", il caricamento potrebbe richiedere del tempo. Ciò significa che l'avvio di uno step potrebbe non essere immediato. Quindi, dopo aver avviato l'esecuzione dello step successivo (ad esempio con il pulsante "Avanti"), il giocatore potrebbe dover attendere un po' di tempo per "visualizzare" le modifiche e poter eseguire un altro step.
Eseguire questi caricamenti a ogni step può risultare fastidioso per il giocatore, anche se sono molto brevi.
Per risolvere questo problema, lo sviluppatore può raggruppare più caricamenti in una determinata fase del gioco. In questo modo il giocatore non avrà caricamenti continui, ma meno, anche se più lunghi.
Ecco vari modi per caricare gli assets: