PIXI 完整示例-PIXI文档翻译(7)

案例研究：寻宝者

所以我告诉你，你现在有所有你需要开始制作游戏的技能。什么？你不相信我？让我向你证明吧！让我们接近如何使一个简单的对象集合和敌人回避游戏称为宝藏猎人。（你会找到它的examples 文件夹。）

[img]http://dl2.iteye.com/upload/attachment/0123/3482/db55d716-ffd2-3406-89bc-3ec9ecd0c5bc.png[/img]

宝藏猎人是一个最简单的完整的游戏，你可以使用迄今为止所学到的工具之一的一个很好的例子。使用键盘箭头键帮助资源管理器找到宝藏，并把它带到出口。六个blob怪物在地牢墙之间上下移动，如果他们击中探险家，他变得半透明，右上角的健康表收缩。如果所有的健康用完，“你失去！”显示在舞台上; 如果资源管理器到达带有宝藏的出口，则显示“You Won！”。虽然它是一个基本的原型，宝藏猎人包含大多数元素，你会发现在更大的游戏：纹理地图集图形，交互性，碰撞和多个游戏场景。让我们来看看游戏是如何组合在一起的，这样你可以使用它作为你自己的游戏的起点。

代码结构

打开treasureHunter.html文件，你会看到所有的游戏代码都在一个大文件。这里是一个鸟瞰图如何组织所有的代码。

//Setup Pixi and load the texture atlas files - call the `setup`
//function when they've loaded

function setup() {
  
  //Initialize the game sprites, set the game `state` to `play`
  //and start the 'gameLoop'
}

function gameLoop() {
  
  //Runs the current game `state` in a loop and renders the sprites
}

function play() {
  
  //All the game logic goes here
}

function end() {
  
  //All the code that should run at the end of the game
}

//The game's helper functions:
//`keyboard`, `hitTestRectangle`, `contain` and `randomInt`

使用它作为你的世界地图的游戏，我们看看每个部分如何工作。


在设置功能中初始化游戏

一旦纹理地图集图像已加载，setup函数就会运行。它只运行一次，并允许您为您的游戏执行一次性设置任务。它是创建和初始化对象，精灵，游戏场景，填充数据数组或解析加载的JSON游戏数据的好地方。

这里是setup对Treasure Hunter中函数的简略视图，以及它执行的任务。

function setup() {
  
  //Create the `gameScene` group
  //Create the `door` sprite
  //Create the `player` sprite
  //Create the `treasure` sprite
  //Make the enemies
  //Create the health bar
  //Add some text for the game over message
  //Create a `gameOverScene` group
  //Assign the player's keyboard controllers

  //set the game state to `play`
  state = play;

  //Start the game loop
  gameLoop();
}

最后两行的码，state = play;并且gameLoop()也许是最重要的。运行gameLoop游戏引擎上的开关，并使得该play函数在连续循环中被调用。但在我们看看它是如何工作之前，让我们看看setup函数中的具体代码是什么。


创建游戏场景

该setup函数创建两个Container称为gameScene和的组 gameOverScene。每个都添加到舞台上。

gameScene = new Container();
stage.addChild(gameScene);

gameOverScene = new Container();
stage.addChild(gameOverScene);

作为主游戏的一部分的所有精灵都被添加到 gameScene组中。应该在游戏结束时显示的文本上的游戏将添加到gameOverScene组中。


[img]http://dl2.iteye.com/upload/attachment/0123/3484/1a188c27-eb99-310d-8867-cbf6088afc39.png[/img]