Pixi’VNInternalizzazione
Questa pagina spiega come aggiungere il supporto multilingue al tuo gioco Pixi'VN utilizzando i18next, incluse le strategie di traduzione dell'interfaccia utente e della narrazione. Come tradurre la visual novel?
Nelle visual novel e nei giochi simili è comune consentire ai giocatori di selezionare la lingua preferita.
Per il tuo progetto Pixi'VN, dovresti utilizzare una libreria esterna per gestire le traduzioni. Ciò ti offre la flessibilità di scegliere l'implementazione più adatta alle tue esigenze.
La libreria più popolare e ampiamente compatibile è i18next.
i18next
Cos'è i18next? i18next è un framework di internazionalizzazione per JavaScript. Per utilizzarlo, è necessario installarlo e inizializzarlo. Per saperne di più, visita il sito web di i18next.
Le traduzioni vengono memorizzate in più file JSON (uno per lingua), utilizzando coppie chiave-valore. La chiave è un identificatore univoco del testo e il valore è la stringa tradotta.
import i18n from 'i18next';
import LanguageDetector from 'i18next-browser-languagedetector';
import { initReactI18next } from 'react-i18next';
import strings_en from '../src/values/translations/strings_en.json';
import strings_es from '../src/values/translations/strings_es.json';
const getUserLang = (): string => {
let userLang: string = navigator.language || "en";
return userLang?.toLocaleLowerCase()?.split("-")[0];
}
export const useI18n = () => {
if (!i18n.isInitialized) {
i18n
.use(LanguageDetector)
.use(initReactI18next)
.init({
debug: false,
fallbackLng: 'en',
lng: getUserLang(),
interpolation: {
escapeValue: false,
},
resources: {
en: strings_en,
es: strings_es,
// Add more languages here
}
});
}
}Crea
ink
If you use ink, you can automatically extract strings from ink text for translation. See more here.
I file JSON di traduzione devono essere creati manualmente. Si consiglia di dividere le traduzioni in due sezioni (vedere strings_es.json):
- Testi UI: per schermate, impostazioni, pulsanti rapidi, ecc.: tutto ciò che non fa parte della narrazione.
- Testi di narrazione: per dialoghi, menu di scelta, ecc.
{
"ui": {
"text_speed": "Velocidad del texto",
// ...
},
"narration": {
"Hello, my name is {{name}}": "Hola, mi nombre es {{name}}"
// ...
}
}