CRÉEZ VOTRE MONDE
Joueurs & Personnages : Avancé

Créer et contrôler des PNJ

33min
learn how to create npcs from zepeto characters apply the sample scripts provided for each feature to add the npc of your choice to your world créer un npc créez un npc à l'aide d'un identifiant zepeto l'apparence du npc et les objets qu'il porte seront identiques à l'identifiant zepeto saisi il est recommandé de créer un personnage zepeto avec une apparence spécifique avant de créer un npc définition de l'objet de localisation où le npc sera créé implémentez par défaut le code de création de personnage zepeto dans votre scène 📘 veuillez vous référer au guide suivant \[ creating a zepeto character docid k4o tkiw83wg jhy0isa ] créer une hiérarchie > créer un objet vide et le renommer npc un objet pour stocker l'emplacement où le npc sera créé définir la position, la rotation écrire un script de création de npc 1\) créez le projet > create > zepeto > typescript et renommez le en npccreator 2\) ecrivez un exemple de script comme ci dessous import { zepetoscriptbehaviour } from 'zepeto script'; import { spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; export default class npccreator extends zepetoscriptbehaviour { // zepeto id of the npc public zepetoid string; // npc character object private npc zepetocharacter; start() { // create a new instance of spawninfo and set its position and rotation based on the object's transform const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // use zepetocharactercreator to create a new character by zepeto id and assign it to npc variable zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; }) } } le déroulement du script est le suivant start() créer un npc dans l'emplacement de l'objet npc en utilisant la fonction zepetocharactercreator createbyzepetoid() et le sauvegarder dans npc 3\) une fois que vous avez fini d'écrire le script, ajoutez le à l'objet npc 4\) attribuer l'identifiant zepeto dans l'inspecteur zepeto id l'id zepeto du npc 5\) appuyez sur le bouton de lecture pour exécuter et le npc sera créé 6\) ajoutez un objet de localisation de npc de la même manière, et ajoutez un script de npc pour créer facilement plusieurs npc étiquetage npc vous pouvez apposer des étiquettes sur vos npc pour les distinguer des joueurs pour créer le préfabriqué name tag canvas 1\) créez un hierachy > ui > canvas et renommez le prefnametagcanvas réglez le mode de rendu sur world space 2\) créez hierarchy> ui > text comme enfant de prefnametagcanvas et renommez le en nametagtext texte représentant le nom ajoutez un composant "content size fitter" pour que le texte ait la bonne taille 3\) une fois que vous avez terminé, faites le glisser vers la fenêtre de projet pour en faire un prefab, puis supprimez le prefnametagcanvas qui se trouve encore dans le surligneur création d'un script de balise de nom de pnj 1\) créez un projet > create > zepeto > typescript et renommez le npccreatorwithnametag 2\) rédigez un exemple de script comme indiqué ci dessous import { zepetoscriptbehaviour } from 'zepeto script'; import { knowsockets, spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; import { canvas, camera, vector3, object, gameobject } from 'unityengine'; import { text } from 'unityengine ui'; export default class npccreatorwithnametag extends zepetoscriptbehaviour { // zepeto id of the npc public zepetoid string; // name to be displayed in the name tag public nametag string; // prefab of the name tag canvas game object public nametagprefab gameobject; // y axis offset value of the name tag canvas game object public nametagyoffset number; // npc character object private npc zepetocharacter; // name tag canvas game object private npcnametagobject gameobject; // text inside the name tag canvas game object private npcnametagtext text; // name tag canvas private canvas canvas; // world camera private cachedworldcamera camera; start() { // create a new instance of spawninfo and set its position and rotation based on the object's transform const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // use zepetocharactercreator to create a new character by zepeto id and assign it to npc variable zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; // set the name tag this setnametag(); }) } // set the name tag setnametag() { // dynamically create the name tag canvas game object this npcnametagobject = object instantiate(this nametagprefab) as gameobject; // set the parent of the name tag canvas game object transform to be the npc transform this npcnametagobject transform setparent(this npc transform); // set the position of the name tag canvas game object above the npc's head this npcnametagobject transform position = vector3 op addition(this npc getsocket(knowsockets head upper) position, new vector3(0, this nametagyoffset,0)); // set the text inside the name tag this npcnametagtext = this npcnametagobject getcomponentinchildren\<text>(); this npcnametagtext text = this nametag; this canvas = this npcnametagobject getcomponent\<canvas>(); this cachedworldcamera = object findobjectoftype\<camera>(); this canvas worldcamera = this cachedworldcamera; } private update() { if (this canvas != null) { this updatecanvasrotation(); } } // update the rotation of the name tag canvas to face the camera private updatecanvasrotation() { this canvas transform lookat(this cachedworldcamera transform); this canvas transform rotate(0, 180, 0); } } le déroulement du script est le suivant start() appeler la fonction personnalisée setnametag() setnametag() génère dynamiquement un badge pour le npc et ajuste la position du badge généré au dessus de la tête du npc définit le texte à l'intérieur de la balise de nom update() appelez la fonction personnalisée updatecanvasrotation() pour faire pivoter le canevas en fonction de la caméra 3\) lorsque vous avez terminé d'écrire le script, ajoutez le à l'objet npc 4\) dans l'inspecteur, assignez les éléments zepeto id, name tag, name tag prefab, et name tag y offset name tag (étiquette de nom) le nom qui apparaîtra sur le badge du npc préfabriqué pour badge le préfabriqué de la toile de l'étiquette de nom name tag y offset une variable qui stocke la valeur de décalage de l'axe des y pour l'objet name tag canvas lorsque vous placez le badge au dessus de la tête du personnage, vous pouvez ajuster la distance entre le personnage et le badge 5\) appuyez sur le bouton de lecture pour l'exécuter, et le npc avec l'étiquette de nom sera créé contrôler le comportement des npc vous pouvez contrôler les actions des npc sauts utilisez l'api de personnage zepeto pour faire sauter le npc vous pouvez utiliser l'api des caractères zepeto pour mettre en œuvre un plus grand nombre de comportements 📘 veuillez vous référer au guide suivant \[ zepeto character docid 1sjftquomtcxfkg3tjh g ] création d'un script de saut de npc 1\) allez dans projet > créer > zepeto > créer typescript et renommez le en npcjump 2\) rédigez un exemple de script comme indiqué ci dessous import { zepetoscriptbehaviour } from 'zepeto script'; import { spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; import { waitforseconds } from 'unityengine'; export default class npcjump extends zepetoscriptbehaviour { // zepeto id of the npc public zepetoid string; // npc character object private npc zepetocharacter; start() { // create a new instance of spawninfo and set its position and rotation based on the object's transform const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // use zepetocharactercreator to create a new character by zepeto id and assign it to npc variable zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; this startcoroutine(this jumpcoroutine()); }); } jumpcoroutine() { // infinite loop to continuously while (true) { // call the jump() method of the zepetocharacter to make it jump this npc jump(); // wait for 5 seconds yield new waitforseconds(5); } } } le déroulement du script est le suivant start() appeler la coroutine jumpcoroutine() jumpcoroutine() appelez la méthode jump() pour que le personnage npc saute toutes les 5 secondes 3\) une fois que vous avez fini d'écrire le script, ajoutez le à l'objet npc 4\) appuyez sur le bouton play et le npc sautera geste utilisez le contrôleur d'animation pour implémenter des gestes pour les npc vous pouvez utiliser le contrôleur d'animation pour mettre en œuvre une plus grande variété de comportements 📘 unity animator controller https //docs unity3d com/manual/class animatorcontroller html https //docs unity3d com/manual/class animatorcontroller html préparation du clip d'animation utilisez le guide suivant pour préparer le clip d'animation gestuelle que votre npc doit réaliser 📘 veuillez vous référer au guide suivant \[ whether to use zepeto character animation docid\ ahh0r8pikezml5up q4dc ] \[ how to apply custom animation docid\ fgnaprjtltzzp5pj6sn4x ] création d'un animateur 1\) project > create > create un contrôleur d'animateur et renommez le en npcanimatorcontroller 2\) sous l’onglet animateur, créer un state > empty 3\) dans l'inspecteur, renommez le de manière appropriée et affectez le clip d'animation à motion création d'un script de gestes pour les npc 1\) créez un projet > create > zepeto > typescript et renommez le npcgesture 2\) rédigez un exemple de script comme indiqué ci dessous import { zepetoscriptbehaviour } from 'zepeto script'; import { spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; import { animator, runtimeanimatorcontroller } from 'unityengine'; export default class npcgesture extends zepetoscriptbehaviour { // the zepeto id of the npc public zepetoid string; // the animator controller of the npc public npcanimator runtimeanimatorcontroller; // npc character object private npc zepetocharacter; start() { // create a new instance of spawninfo and set its position and rotation based on the object's transform const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // use zepetocharactercreator to create a new character by zepeto id and assign it to npc variable zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; // get the animator component from the npc character and set its runtimeanimatorcontroller to npcanimator this npc getcomponentinchildren\<animator>() runtimeanimatorcontroller = this npcanimator; }); } } le déroulement du script est le suivant start() récupère le composant animator de l'objet npc et le place sur le contrôleur d'animation spécifié par la variable npcanimator 3\) une fois le script écrit, ajoutez le à l'objet location où le pnj sera créé 4\) dans l'inspecteur, assignez le zepeto id, npc animator npc animator le contrôleur d'animation du npc 5\) appuyez sur le bouton "play" pour l'exécuter et vous verrez le npc faire un geste 6\) vous pouvez appliquer ce principe pour créer des npc qui effectuent d'autres actions que des gestes et des sauts bulles sur les npc you can create a canvas above an npc's head, display an image or text, and make it bubble création d'une bulle de dialogue préfabriquée 1\) créez un hierarchy> ui > canvas et renommez le prefspeechbubblecanvas réglez le mode de rendu sur world space 2\) créez un hierarchy> ui > image comme enfant de prefspeechbubblecanvas et renommez le speechbubbleimage il s'agit de l'image qui constituera l'arrière plan de la bulle 3\) créez hierarchy> ui > text comme enfant de speeachbubbleimage et renommez le en speeachbubbletext il s'agit du texte à l'intérieur de la bulle ajoutez un composant "content size fitter" pour que le texte ait la bonne taille 4\) une fois que vous avez terminé, faites le glisser vers la fenêtre de projet pour en faire un prefab, puis supprimez le prefspeechbubblecanvas qui se trouve encore dans le highlight création d'un script de bulles de dialogue pour les npc 1\) créez un projet > create > zepeto > typescript et renommez le npcspeechbubble 2\) rédigez un exemple de script comme indiqué ci dessous import { zepetoscriptbehaviour } from 'zepeto script'; import { knowsockets, spawninfo, zepetocharacter, zepetocharactercreator } from 'zepeto character controller'; import { canvas, camera, vector3, object, gameobject } from 'unityengine'; import { text } from 'unityengine ui'; export default class npcspeechbubble extends zepetoscriptbehaviour { // zepeto id of the npc public zepetoid string; // dialogue content to be displayed in the speech bubble public speechbubbletext string; // prefab of the speech bubble canvas game object public speechbubbleprefab gameobject; // y axis offset value of the speech bubble canvas game object public speechbubbleyoffset number; // npc character object private npc zepetocharacter; // speech bubble canvas game object private speechbubbleobject gameobject; // text inside the speech bubble canvas game object private speechbubbletext text; // speech bubble canvas private canvas canvas; // world camera private cachedworldcamera camera; start() { // create a new instance of spawninfo and set its position and rotation based on the object's transform const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // use zepetocharactercreator to create a new character by zepeto id and assign it to npc variable zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; // set the speech bubble this setbubble(); }) } // set the speech bubble setbubble() { // dynamically create the speech bubble canvas game object this speechbubbleobject = object instantiate(this speechbubbleprefab) as gameobject; // set the parent of the speech bubble canvas game object transform to be the npc transform this speechbubbleobject transform setparent(this npc transform); // set the position of the speech bubble canvas game object above the npc's head this speechbubbleobject transform position = vector3 op addition(this npc getsocket(knowsockets head upper) position, new vector3(0, this speechbubbleyoffset,0)); // set the text inside the speech bubble this speechbubbletext = this speechbubbleobject getcomponentinchildren\<text>(); this setbubbletext(this speechbubbletext); this canvas = this speechbubbleobject getcomponent\<canvas>(); this cachedworldcamera = object findobjectoftype\<camera>(); this canvas worldcamera = this cachedworldcamera; } // open the speech bubble canvas and set the text setbubbletext(bubbletext string) { this speechbubbleobject setactive(true); this speechbubbletext text = bubbletext; } private update() { if (this canvas != null) { this updatecanvasrotation(); } } // update the rotation of the speech bubble canvas to face the camera private updatecanvasrotation() { this canvas transform lookat(this cachedworldcamera transform); this canvas transform rotate(0, 180, 0); } } le déroulement du script est le suivant start() appeler la fonction personnalisée setbubble() setbubble() créer un canevas de bulle de dialogue (speechbubbleprefab) et positionner la bulle créée au dessus de la tête du pnj appelez la fonction personnalisée setbubbletext() pour définir le texte à l'intérieur de la bulle setbubbletext() active le canevas de bulle de dialogue du pnj ( speechbubbleobject) affiche la chaîne donnée en paramètre (bubbletext) à l'intérieur de la bulle de dialogue update() appelez la fonction personnalisée updatecanvasrotation() pour faire pivoter le canevas en fonction de la caméra 3\) lorsque vous avez terminé d'écrire le script, ajoutez le à l'objet location où le npc sera créé 4\) dans l'inspecteur, attribuez l'identifiant zepeto, le texte de la bulle, le préfabriqué de la bulle et le décalage y de la bulle texte de la bulle de dialogue cette variable stocke le dialogue que le npc dira dans la bulle dans notre exemple, nous stockons le dialogue suivant "hello world" préfab de la bulle de dialogue cette variable stocke le préfabriqué de l'objet de jeu speech bubble canvas décalage y de la bulle de dialogue cette variable stocke la valeur de décalage de l'axe des y pour le gameobject speech bubble canvas cela vous permet d'ajuster la distance entre le personnage et la bulle de dialogue lorsque vous placez la bulle de dialogue au dessus de la tête du personnage 5\) appuyez sur le bouton "play" pour l'exécuter, et vous verrez une bulle de dialogue flotter au dessus de la tête du npc interagir avec le npc l'interaction avec les npc permet de créer un contenu amusant dans ce guide, nous allons utiliser un exemple pour implémenter une bulle de dialogue qui change lorsqu'un npc est approché mise en place du collisionneur 1\) ajoutez un composant collider à votre objet pour interagir avec le npc et vérifiez istrigger 2\) redimensionner le collisionneur de manière à ce que le joueur puisse interagir avec le npc création d'un script d'interaction avec un npc 1\) créez le projet > create > zepeto > typescript et renommez le en npcinteraction 2\) rédigez un exemple de script comme indiqué ci dessous import { zepetoscriptbehaviour } from 'zepeto script'; import { knowsockets, spawninfo, zepetocharacter, zepetocharactercreator, zepetoplayers } from 'zepeto character controller'; import { canvas, camera, vector3, object, gameobject, collider } from 'unityengine'; import { text } from 'unityengine ui'; export default class npcinteraction extends zepetoscriptbehaviour { // zepeto id of the npc public zepetoid string; // dialogue content to be displayed in the speech bubble public speechbubbletext string; public changedspeechbubbletext string; // prefab of the speech bubble canvas game object public speechbubbleprefab gameobject; // y axis offset value of the speech bubble canvas game object public speechbubbleyoffset number; // local character object private zepetocharacter zepetocharacter; // npc character object private npc zepetocharacter; // speech bubble canvas game object private speechbubbleobject gameobject; // text inside the speech bubble canvas game object private speechbubbletext text; // speech bubble canvas private canvas canvas; // world camera private cachedworldcamera camera; start() { // create a new instance of spawninfo and set its position and rotation based on the object's transform const spawninfo = new spawninfo(); spawninfo position = this transform position; spawninfo rotation = this transform rotation; // use zepetocharactercreator to create a new character by zepeto id and assign it to npc variable zepetocharactercreator createbyzepetoid(this zepetoid, spawninfo, (character zepetocharacter) => { this npc = character; // set the speech bubble this setbubble(); }) zepetoplayers instance onaddedlocalplayer addlistener(() => { this zepetocharacter = zepetoplayers instance localplayer zepetoplayer character; }); } // check if player character enter collider ontriggerenter(collider collider) { if (this zepetocharacter == null || collider gameobject != this zepetocharacter gameobject) { return; } this setbubbletext(this changedspeechbubbletext); } ontriggerexit(collider collider) { if (this zepetocharacter == null || collider gameobject != this zepetocharacter gameobject) { return; } this setbubbletext(this speechbubbletext); } // set the speech bubble setbubble() { // dynamically create the speech bubble canvas game object this speechbubbleobject = object instantiate(this speechbubbleprefab) as gameobject; // set the parent of the speech bubble canvas game object transform to be the npc transform this speechbubbleobject transform setparent(this npc transform); // set the position of the speech bubble canvas game object above the npc's head this speechbubbleobject transform position = vector3 op addition(this npc getsocket(knowsockets head upper) position, new vector3(0, this speechbubbleyoffset,0)); // set the text inside the speech bubble this speechbubbletext = this speechbubbleobject getcomponentinchildren\<text>(); this setbubbletext(this speechbubbletext); this canvas = this speechbubbleobject getcomponent\<canvas>(); this cachedworldcamera = object findobjectoftype\<camera>(); this canvas worldcamera = this cachedworldcamera; } // open the speech bubble canvas and set the text setbubbletext(bubbletext string) { this speechbubbleobject setactive(true); this speechbubbletext text = bubbletext; } private update() { if (this canvas != null) { this updatecanvasrotation(); } } // update the rotation of the speech bubble canvas to face the camera private updatecanvasrotation() { this canvas transform lookat(this cachedworldcamera transform); this canvas transform rotate(0, 180, 0); } } le déroulement du script est le suivant ontriggerenter(), ontriggerexit() lorsque le déclencheur est détecté en entrant dans la zone de collision, appelez la fonction personnalisée setbubbletext() pour définir le texte à l'intérieur de la bulle vocale sur changedspeechbubbletext lorsqu'elle quitte la zone de collision, appelez la fonction personnalisée setbubbletext() pour définir le texte à l'intérieur de la bulle en speechbubbletext 3\) lorsque vous avez terminé d'écrire le script, ajoutez le à l'objet location où le npc sera créé 4\) dans l'inspecteur, attribuez l'identifiant zepeto, le texte de la bulle, le préfabriqué de la bulle, le décalage y de la bulle et la bulle modifiée texte de la bulle de dialogue cette variable stocke le dialogue que le npc dira dans la bulle dans notre exemple, nous stockons le dialogue suivant "hello world" préfab de la bulle de dialogue cette variable stocke le préfabriqué de l'objet de jeu speech bubble canvas décalage y de la bulle de dialogue cette variable stocke la valeur de décalage de l'axe des y pour le gameobject speech bubble canvas cela vous permet d'ajuster la distance entre le personnage et la bulle de dialogue lorsque vous placez la bulle de dialogue au dessus de la tête du personnage changed speech bubble enregistre le dialogue qui sera affiché dans la bulle du npc lorsque le joueur entrera dans la zone de collision du npc 5\) appuyer sur play pour exécuter, et lorsque le joueur s'approche du npc, le texte dans la bulle change appliquer l'interaction avec les npc pour créer un format de dialogue, créez une interface utilisateur à l'aide d'un panneau voici un exemple de dialogue simple composé de panneaux et de boutons il s'agit d'un exemple de script qui ouvre des dialogues lors de l'interaction avec les npc et les traite lorsque chaque bouton est pressé appliquez ce principe pour mettre en place un contenu intéressant import { gameobject, humanbodybones, object, collider } from 'unityengine'; import { zepetoscriptbehaviour } from 'zepeto script'; import { button } from 'unityengine ui'; import { zepetocharacter, zepetoplayers } from "zepeto character controller"; export default class npcdialoginteraction extends zepetoscriptbehaviour { public npcdialogcanvas gameobject; public yesbutton button; public nobutton button; private zepetocharacter zepetocharacter; start() { zepetoplayers instance onaddedlocalplayer addlistener(()=>{ this zepetocharacter = zepetoplayers instance localplayer zepetoplayer character; }); // dialog select yes this yesbutton onclick addlistener(() => { console log("yes") this npcdialogcanvas setactive(false); }); // dialog select no this nobutton onclick addlistener(() => { console log("no") this npcdialogcanvas setactive(false); }); } // check if player character enter collider ontriggerenter(collider collider) { if (this zepetocharacter == null || collider gameobject != this zepetocharacter gameobject) { return; } this npcdialogcanvas setactive(true); } ontriggerexit(collider collider) { if (this zepetocharacter == null || collider gameobject != this zepetocharacter gameobject) { return; } this npcdialogcanvas setactive(false); } }