Tout d'abord, cet article est le quatrième article sur le développement base zéro des jeux RPG - série de conférences open source pour implémenter des scripts de jeu et utiliser des scripts de jeu Il semble que cela ait pris beaucoup de temps depuis la dernière mise à jour pour réaliser le changement de scène de carte. Avant de lire le texte suivant, vous devez comprendre ce que contiennent les trois premiers articles mentionnés ci-dessous.
1. Qu'est-ce qu'un script de jeu ?
En termes simples, un script de jeu est un fichier exécutable écrit dans un certain format. Le jeu peut être exécuté via des instructions personnalisées. dans le script. Exécutez la logique correspondante.
Les scripts de jeu peuvent rendre nos jeux dynamiques. Par exemple, lorsque nous développons un jeu RPG, l'intrigue, les événements et les cartes, etc. ., si nous écrivons tout cela dans le programme, bien sûr, c'est possible, mais une fois qu'un problème survient, même quelques fautes de frappe, nous devons d'abord corriger ces fautes de frappe, puis recompiler et publier l'intégralité du programme. Ce processus est assez dégoûtant. , car si le programme du jeu est constamment modifié pour suivre le contenu du jeu, cela ne fera que rendre votre programme de plus en plus complexe. Mais si nous définissons ces données répétables dans des fichiers extérieurs au programme de jeu, lorsque le moteur de jeu est développé, notre jeu exécutera l'intrigue et les événements correspondants en lisant ces fichiers externes, puis, comme mentionné ci-dessus, s'il y a un problème avec notre jeu , il nous suffit de modifier ces fichiers externes et nous n'avons pas besoin de recompiler l'intégralité du programme. Cela rend le développement de notre jeu pratique et concis.
* Bien entendu, pour le HTML5, il n'est pas nécessaire de recompiler le programme, mais pour les jeux RPG, les scripts restent indispensables, car il est impossible d'écrire tous les scripts du jeu dans le programme. .
D'accord, voyons d'abord sous quelle forme créer le script du jeu. Combien de méthodes utilisons-nous. avez-vous ? Il y a plusieurs options, vous pouvez choisir xml, vous pouvez choisir json, ou vous pouvez choisir une syntaxe purement personnalisée,
Par exemple, j'ai développé le script de jeu flash L # http://blog.csdn .net/lufy_legend/article/details/6889424
Cette fois, afin d'éviter les ennuis, j'ai choisi json, qui est plus facile à traiter, car javascript peut facilement traiter les données json .
Le contenu actuellement implémenté dans le jeu comprend l'ajout de scènes de carte, l'ajout de personnages de jeu et la mise en œuvre de dialogues entre personnages. Ensuite, lorsque je conçois le script du jeu, je dois inclure ces données, et ces trois fonctions peuvent alors être contrôlées par le script.
Regardez d'abord le json ci-dessous
var script = {
stage01:{
map:[
[18,18,18,18,18,18,18,18,18,18,18,18,55,55,18,18,18],
[18,18,18,17,17,17,17,17,17,17,17,17,55,55,17,17,18],
[18,18,17,17,17,17,18,18,17,17,17,17,55,55,17,17,18],
[18,17,17,17,18,18,18,18,18,17,17,55,55,17,17,17,18],
[18,17,17,18,22,23,23,23,24,18,17,55,55,17,17,17,18],
[18,17,17,18,25,28,26,79,27,18,55,55,17,17,17,17,18],
[18,17,17,17,17,10,11,12,18,18,55,55,17,17,17,17,18],
[18,18,17,17,10,16,16,16,11,55,55,17,17,17,17,17,18],
[18,18,17,17,77,16,16,16,16,21,21,17,17,17,17,17,18],
[18,18,17,17,77,16,16,16,16,55,55,17,17,17,17,17,18],
[18,18,18,18,18,18,18,18,18,55,55,18,18,18,18,18,18]],
mapdata:[
[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1],
[1,1,1,0,0,0,0,0,0,0,0,0,1,1,0,0,1],
[1,1,0,0,0,0,1,1,0,0,0,0,1,1,0,0,1],
[1,0,0,0,1,1,1,1,1,0,0,1,1,0,0,0,1],
[1,0,0,1,1,1,1,1,1,1,0,1,1,0,0,0,1],
[1,0,0,1,1,1,0,1,1,1,1,1,0,0,0,0,1],
[1,0,0,0,0,0,0,0,1,1,1,1,0,0,0,0,1],
[1,1,0,0,0,0,0,0,0,1,1,0,0,0,0,0,1],
[1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1],
[1,1,0,0,0,0,0,0,0,1,1,0,0,0,0,0,1],
[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]],
add:[
{chara:"player",img:"mingren",x:5,y:6},
{chara:"npc",img:"npc1",x:7,y:6},
{chara:"npc",img:"npc1",x:3,y:3}],
talk:{
talk1:[
{img:"m",name:"鸣人",msg:"我是木叶村的鸣人，你是谁？"},
{img:"n",name:"黑衣忍者甲",msg:"你就是鸣人？九尾还在你身体里吗？"}
],
talk2:[
{img:"n",name:"黑衣忍者乙",msg:"鸣人，听说忍者大战就要开始了。"},
{img:"m",name:"鸣人",msg:"真的吗？一定要想想办法啊。"}
]
}
}
};
J'ai défini le script comme une variable Lors de la création du jeu, le script doit être stocké dans un document externe. Expliquer simplement la théorie et comment l'améliorer est un autre sujet, haha.
Comme vous pouvez le voir, le json contient des tableaux de cartes et des tableaux de données cartographiques liés à la carte, des données liées aux caractères ajoutés et des tableaux pour les dialogues. De cette façon, lorsque le jeu est affiché, il me suffit de lire les données json, puis d'afficher l'écran de jeu en fonction de ce contenu. Je définis une fonction initScript pour effectuer ces opérations.
function initScript(){
//地图位置初始化
mapLayer.x = 0;
mapLayer.y = 0;
//地图层初始化
mapLayer.removeAllChild();
//人物层初始化
charaLayer.removeAllChild();
//效果层初始化
effectLayer.removeAllChild();
//对话层初始化
talkLayer.removeAllChild();
//地图数据获取
map = stage.map;
mapdata = stage.mapdata;
//对话数据获取
talkScriptList = stage.talk;
//添加地图
addMap(0,0);
delMap();
//添加人物
addChara();
}La méthode removeAllChild est une méthode unique au moteur lufylegend. Elle peut être utilisée pour supprimer tous les sous-objets de la couche d'affichage LScript, réalisant ainsi l'initialisation de chaque couche d'affichage dans celle-ci. jeu.
Modifiez la méthode addChara comme suit
//添加人物
function addChara(){
var charaList = stage.add;
var chara,charaObj;
for(var i=0;i<charaList.length;i++){
charaObj = charaList[i];
if(charaObj.chara == "player"){
//加入英雄
bitmapdata = new LBitmapData(imglist[charaObj.img]);
chara = new Character(true,i,bitmapdata,4,4);
player = chara;
}else{
//加入npc
bitmapdata = new LBitmapData(imglist[charaObj.img]);
chara = new Character(false,i,bitmapdata,4,4);
}
chara.x = charaObj.x * 32;
chara.y = charaObj.y * 32;
charaLayer.addChild(chara);
}
}C'est-à-dire, ajoutez des personnages dans le jeu en fonction du tableau d'ajout dans le script json.
D'accord, lancez le jeu, vous pouvez voir que le jeu s'affiche normalement, exactement de la même manière qu'avant, et implémente les mêmes fonctions. 
Afin de permettre à tout le monde de voir la commodité des scripts de jeu, les scripts sont désormais utilisés pour changer de scène dans le jeu. .
Modifiez le script json comme suit
var script = {
stage01:{
map:[
[18,18,18,18,18,18,18,18,18,18,18,18,55,55,18,18,18],
[18,18,18,17,17,17,17,17,17,17,17,17,55,55,17,17,18],
[18,18,17,17,17,17,18,18,17,17,17,17,55,55,17,17,18],
[18,17,17,17,18,18,18,18,18,17,17,55,55,17,17,17,18],
[18,17,17,18,22,23,23,23,24,18,17,55,55,17,17,17,18],
[18,17,17,18,25,28,26,79,27,18,55,55,17,17,17,17,18],
[18,17,17,17,17,10,11,12,18,18,55,55,17,17,17,17,18],
[18,18,17,17,10,16,16,16,11,55,55,17,17,17,17,17,18],
[18,18,17,17,77,16,16,16,16,21,21,17,17,17,17,17,18],
[18,18,17,17,77,16,16,16,16,55,55,17,17,17,17,17,18],
[18,18,18,18,18,18,18,18,18,55,55,18,18,18,18,18,18]],
mapdata:[
[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1],
[1,1,1,0,0,0,0,0,0,0,0,0,1,1,0,0,1],
[1,1,0,0,0,0,1,1,0,0,0,0,1,1,0,0,1],
[1,0,0,0,1,1,1,1,1,0,0,1,1,0,0,0,1],
[1,0,0,1,1,1,1,1,1,1,0,1,1,0,0,0,1],
[1,0,0,1,1,1,0,1,1,1,1,1,0,0,0,0,1],
[1,0,0,0,0,0,0,0,1,1,1,1,0,0,0,0,1],
[1,1,0,0,0,0,0,0,0,1,1,0,0,0,0,0,1],
[1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1],
[1,1,0,0,0,0,0,0,0,1,1,0,0,0,0,0,1],
[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1]],
add:[
{chara:"player",img:"mingren",x:5,y:6},
{chara:"npc",img:"npc1",x:7,y:6},
{chara:"npc",img:"npc1",x:3,y:3}],
talk:{
talk1:[
{img:"m",name:"鸣人",msg:"我是木叶村的鸣人，你是谁？"},
{img:"n",name:"黑衣忍者甲",msg:"你就是鸣人？九尾还在你身体里吗？"}
],
talk2:[
{img:"n",name:"黑衣忍者乙",msg:"鸣人，听说忍者大战就要开始了。"},
{img:"m",name:"鸣人",msg:"真的吗？一定要想想办法啊。"}
]
},
jump:[
{at:{x:6,y:5},to:"stage02"}
]
},
stage02:{
map:[
[0,0,1,2,2,2,2,2,2,2,2,1,0,0,0],
[0,0,1,3,5,5,1,5,5,5,5,1,0,0,0],
[0,0,1,80,4,4,1,80,4,4,4,1,0,0,0],
[0,0,1,80,4,4,1,80,8,7,8,1,0,0,0],
[0,0,1,80,4,4,5,81,4,4,4,1,0,0,0],
[0,0,1,2,2,2,6,4,4,4,4,1,0,0,0],
[0,0,1,3,5,5,81,4,4,4,4,1,0,0,0],
[0,0,1,80,4,4,4,4,4,4,9,1,0,0,0],
[0,0,1,2,2,2,2,6,2,2,2,1,0,0,0]],
mapdata:[
[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1],
[1,1,1,0,0,0,1,0,0,0,0,1,1,1,1],
[1,1,1,0,0,0,1,0,0,0,0,1,1,1,1],
[1,1,1,0,0,0,1,0,0,1,0,1,1,1,1],
[1,1,1,0,0,0,0,0,0,0,0,1,1,1,1],
[1,1,1,1,1,1,0,0,0,0,0,1,1,1,1],
[1,1,1,0,0,0,0,0,0,0,0,1,1,1,1],
[1,1,1,0,0,0,0,0,0,0,1,1,1,1,1],
[1,1,1,1,1,1,1,0,1,1,1,1,1,1,1]],
add:[
{chara:"player",img:"mingren",x:7,y:8},
{chara:"npc",img:"npc1",x:8,y:3},
{chara:"npc",img:"npc1",x:10,y:3}],
talk:{
talk1:[
{img:"m",name:"鸣人",msg:"你们在干什么啊？"},
{img:"n",name:"黑衣忍者甲",msg:"我们在喝茶。"}
],
talk2:[
{img:"n",name:"黑衣忍者乙",msg:"我们在喝茶，你不要打扰我们。"},
{img:"m",name:"鸣人",msg:"....."}
]
},
jump:[
{at:{x:7,y:8},to:"stage01"}
]
}
};
Comme vous pouvez le voir, j'ai ajouté stage02, la deuxième scène, et introduit le nœud de saut dans le script pour contrôler la scène de jeu Commutation, où at in jump représente la coordonnée vers laquelle le protagoniste du jeu se déplace, et to représente le nom de l'écran vers lequel sauter après avoir atteint cette coordonnée. La raison pour laquelle le saut ici est un tableau est qu'une scène peut également passer à plusieurs autres scènes.
Le script ci-dessus réalise le saut mutuel entre les scènes stage01 et stage02.
Afin de lire ce saut et de le mettre en œuvre, nous devons juger s'il doit sauter après que le protagoniste du jeu ait fait un pas, et modifier la méthode onmove de la classe Character
/**
* 开始移动
**/
Character.prototype.onmove = function (){
var self = this;
//设定一个移动步长中的移动次数
var ml_cnt = 4;
//计算一次移动的长度
var ml = STEP/ml_cnt;
//根据移动方向，开始移动
switch (self.direction){
case UP:
if(mapmove){
mapLayer.y += ml;
charaLayer.y += ml;
}
self.y -= ml;
break;
case LEFT:
if(mapmove){
mapLayer.x += ml;
charaLayer.x += ml;
}
self.x -= ml;
break;
case RIGHT:
if(mapmove){
mapLayer.x -= ml;
charaLayer.x -= ml;
}
self.x += ml;
break;
case DOWN:
if(mapmove){
mapLayer.y -= ml;
charaLayer.y -= ml;
}
self.y += ml;
break;
}
self.moveIndex++;
//当移动次数等于设定的次数，开始判断是否继续移动
if(self.moveIndex >= ml_cnt){
//一个地图步长移动完成后，判断地图是否跳转
if(self.isHero && self.moveIndex > 0)checkJump();
self.moveIndex = 0;
//一个地图步长移动完成后，如果地图处于滚动状态，则移除多余地图块
if(mapmove)delMap();
//如果已经松开移动键，或者前方为障碍物，则停止移动，否则继续移动
if(!isKeyDown || !self.checkRoad()){
self.move = false;
return;
}else if(self.direction != self.direction_next){
self.direction = self.direction_next;
self.anime.setAction(self.direction);
}
//地图是否滚动
self.checkMap(self.direction);
}
};J'ai ajouté une ligne
if(self.isHero && self.moveIndex > 0)checkJump();
pour indiquer qu'après le mouvement, si le personnage est le protagoniste du jeu, un jugement de saut sera effectué
Il faut donc ajouter un Méthode checkJump
//游戏场景跳转测试
function checkJump(){
var jump = stage.jump;
var jumpstage;
for(var i=0;i<jump.length;i++){
jumpstage = jump[0];
if(player.x == jumpstage.at.x * 32 && player.y == jumpstage.at.y * 32){
//获取该场景脚本数据
stage = script[jumpstage.to];
//开始跳转
initScript(stage);
return;
}
}
}D'accord, tout est très simple. Lancez le jeu et voyez l'effet Lorsque le petit Naruto se dirige vers la porte de la petite pièce sur la carte, la scène saute
. 
URL du test du jeu :
http://lufylegend.com/demo/rpg/index.html
Le package du moteur lufylegend.js contient cette démo, veuillez télécharger le moteur lufylegend.js directement et afficher le code source dans le package du moteur
Adresse de téléchargement du moteur lufylegend.js
http://lufylegend.com/lufylegend
Ce qui précède est le développement de jeux html5 - développement base zéro de jeux RPG - conférence open source ( 4) - Scripts de jeu et contenu de saut de carte, pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !
Quelles sont les méthodes de production de production d'animation html5 ?
La différence entre HTML et HTML5
Outil de valorisation de nom de domaine de site Web
démarrage m²
Comment créer un site FTP
Comment désactiver le téléchargement automatique de WeChat
qu'est-ce que l'USDT
Qu'est-ce que l'interface Web
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
