VNLEWIKICréez des histoires. Reliez des mondes.
Français
Manuel VNLE

RPG Maker MZ

← Intégrer le contenu à votre jeu

RPG Maker MZ · JavaScript et commandes d’événement

Commencez par afficher une seule phrase. Ce petit exemple lit directement les données exportées de La clé du port ; il ne constitue pas un système de dialogue complet. Reliez ensuite ces données à l’interface de votre jeu.

1 · Préparer les fichiers et la scène

Ce guide concerne MZ. Copiez story.json dans data/. Créez un événement de carte déclenché par Action Button. Ajoutez d’abord le script de chargement, puis la boucle d’attente ci-dessous, puis le script d’affichage. Réservez la variable de jeu 1 au texte et la variable 2 aux associations d’images. Ajoutez ensuite une commande Show Text contenant \V[1]. Aucun plugin n’est requis.

story.json · Comprendre les fichiers exportés

2 · Afficher le premier texte

// Event command: Script. The next command waits until loading finishes.
$gameTemp.vnleExample = { ready: false, story: null, error: null };
const request = new XMLHttpRequest();
request.open('GET', 'data/story.json');
request.overrideMimeType('application/json');
request.timeout = 15000;
request.onload = () => {
  try {
    if (request.status >= 400) throw new Error('HTTP ' + request.status);
    $gameTemp.vnleExample.story = JSON.parse(request.responseText);
  } catch (error) { $gameTemp.vnleExample.error = String(error); }
  $gameTemp.vnleExample.ready = true;
};
request.onerror = request.ontimeout = () => {
  $gameTemp.vnleExample.error = 'Cannot load data/story.json';
  $gameTemp.vnleExample.ready = true;
};
request.send();

Ajoutez ensuite les commandes d’événement : Loop → Conditional Branch (Script : $gameTemp.vnleExample.ready) → Break Loop → End → Wait: 1 frame → Repeat Above. Placez le script d’affichage après la boucle. Le moteur reste ainsi réactif pendant le chargement.

// Event command: Script, AFTER the loading loop below has finished.
const result = $gameTemp.vnleExample;
if (result.error) {
  $gameVariables.setValue(1, result.error);
} else {
  const locale = 'en';
  const id = 'fd7b61a3-8233-4ba7-8f77-b88b119a91bf';
  const content = result.story.content;
  const translation = (content.translations[locale] || {})[id];
  const message = translation ? translation.message : content.texts[id].sourceMessage;
  const line = message.segments.map(segment => {
    if (segment.kind !== 'text') throw new Error('Text-only example');
    return segment.text;
  }).join('');
  $gameVariables.setValue(1, line);
}
// Next event command: Show Text, containing \V[1]. Reserve variable 1 for this sample.

Résultat attendu : « Welcome to the harbour. I am Mira. » Avec locale = "de" ou le paramètre de langue de : « Willkommen im Hafen. Ich bin Mira. » Une langue absente utilise le texte source. Cet exemple prend en charge les segments de texte ; il ne supprime pas silencieusement les paramètres de substitution.

3 · D'une phrase à une conversation

L’identifiant de texte fixe ci-dessus sert au premier test. Dans votre jeu, choisissez flowRef/entryRef dans story-index.json, puis lisez execution.entries[entryRef].nodeRef et execution.nodes[nodeRef]. Le dialogue courant fournit text.textRef et speakerRef. La suite dépend du champ kind du nœud.

Show Text affiche la variable 1 et attend la confirmation. Show Choices propose les réponses avec les branches d’événement correspondantes. Pour une liste dynamique issue de l’export complet, le jeu relie les identifiants des options à son propre contrôleur de choix. End termine les événements de conversation et retire l’image de dialogue.

  1. Continue et End : suivre les connexions et fermer la boîte de dialogue
  2. Choix : identifiant, ordre et suite de la réponse sélectionnée
  3. Conditions et variables : dix ou deux pièces d’or
  4. Langue : mêmes identifiants, contenu relu dans la langue choisie
  5. Command : donner un objet ou ouvrir une boutique
  6. Call/Return : appeler une sous-histoire puis revenir
Examiner les réponses et la vérification de l’or dans ce langage

Lire les données pour un choix

Insérez cet extrait là où story est disponible après le chargement. Pour RPG Maker, utilisez const story = $gameTemp.vnleExample.story;. Il affiche les identifiants pour vérification ; remplacez cet affichage par vos boutons de réponse. Il couvre les deux réponses du port et la vérification de l’or qui suit, pas l’ensemble des types de nœuds.

// story is already loaded. Keep each optionId on its answer button.
const choice = story.execution.nodes['42edfff8-b8fe-46bf-ae0d-9e2347b6e726'];
for (const optionId of choice.optionOrder) {
  const option = choice.options[optionId];
  console.log(optionId, option.text.textRef); // Resolve text, then create your button.
}
// Inspect the actual purchase check. This particular node is Gold >= 5.
const branch = story.execution.nodes['c1c3c372-0a73-4cd0-851d-ede59d5709bb'];
const gold = 10; // Repeat with 2, using your current game value.
const next = gold >= branch.condition.right.value.value ? branch.whenTrue : branch.whenFalse;
console.log(next.nodeRef);

Avec 10 pièces d’or, next désigne Pay five gold ; avec 2, Not enough gold. Dans le jeu, effectuez cette vérification uniquement lorsque le parcours choisi atteint ce nœud. Chaque réponse possède sa propre suite.

4 · Associer vos propres images

Cet extrait complémentaire suppose que le dialogue courant se trouve dans un objet nommé node et que les éléments d’interface cités en commentaire existent. En C++ et MonoGame, speakerRef a déjà été lu dans SpeakerId ou speakerId. La clé est le véritable identifiant de Mira ; le nom et l’emplacement de l’image dépendent de votre jeu. Insérez les lignes aux endroits indiqués.

// node is your current VNLE dialogue. Reserve variable 2 for this mapping.
$gameVariables.setValue(2, node.speakerRef === '807b2957-7bab-4a28-83a4-1f3d1589bbc2' ? 1 : 0);
// Event commands: if Variable 2 == 1, Show Picture 20: mira from img/pictures.
// Otherwise: Erase Picture 20. Erase it again when the conversation ends.

Retrouvez le nom du personnage avec content.characters[speakerRef].nameTextRef, comme pour un texte de dialogue. Si aucune image n’est associée, masquez l’ancien portrait ou affichez une image de remplacement. Les images ne sont pas choisies selon la langue.

Utiliser les références d'image de l'exportation complète

5 · Inclure les fichiers dans le jeu distribué

Après le déploiement, vérifiez la présence de data/story.json. Importez les images dans l’éditeur en tenant compte de l’option d’exclusion des fichiers inutilisés. Ne supposez pas que les API de MZ fonctionnent sans adaptation dans MV, VX Ace ou une autre édition.

Vérifiez votre résultat

  1. Les salutations en anglais et en allemand s'affichent correctement; une langue non disponible revient à l'anglais.
  2. Après avoir ajouté la progression, testez les deux réponses, 10 puis 2 pièces d’or, le retour de la sous-histoire et End.
  3. Lancez le jeu compilé en dehors du dossier du projet. Les fichiers JSON, les polices et les portraits doivent y être accessibles aussi.

Documentation officielle

Documentation des API et de la configuration utilisées :