Gestisci il flusso di narrazione con le label

Il flusso di narrazione è gestito da funzioni quali callLabel, jumpLabel, goNext, goBack e closeLabel, tutte disponibili nell'oggetto narration.

Esegui una label

Vai allo step successivo e torna indietro

Vai allo step successivo

Per eseguire lo step successivo, utilizza la funzione narration.goNext(). Questa funzione ha i seguenti parametri:

• props: le proprietà da passare alla label. L'interfaccia corrisponde a StepLabelProps.

import { narration } from '@drincs/pixi-vn'

await narration.goNext({})

narration.goNext() è asincrono, quindi puoi usare .then per, ad esempio, disabilitare un pulsante "Avanti" finché lo step non è completato.

import { narration } from '@drincs/pixi-vn'

// disable next button
narration.goNext({})
    .then((result) => {
        // enable next button
    })

Torna indietro

Ad ogni step, il sistema salva lo stato attuale del gioco. Per tornare allo step precedente, utilizza la funzione stepHistory.goBack().

You must pass a function navigate: (path: string) => void as a parameter. This function will be called with the URL Path or Route of the previous step, so you can navigate to the previous UI screen.

For example, if you use React Router Dom:

import { stepHistory } from '@drincs/pixi-vn'
import { useNavigate } from 'react-router-dom';

const navigate = useNavigate();

if (stepHistory.canGoBack) {
    stepHistory.goBack(navigate).then(() => {
        // ...
    })
}

Chiudere le label