用phaser编写的一个吃金币游戏【冰斌棒模仿】

 冰斌棒   2018-01-25 16:01   218 人阅读  0 条评论
<!DOCTYPE html> 
<head> 
 <meta charset="UTF-8" />
 <title>exam</title>
  <!-- 首先,要导入js文件。  -->
  <script src="phaser.min.js"></script>
</head>
<body>
 <script type="text/javascript">
  //创建一个游戏窗口
  var game = new Phaser.Game(800, 600, Phaser.CANVAS, '', { preload: preload, create: create, update: update });
  function preload()//加载资源
  {
   //通过 game.load.image | spritesheet 来加载一些必须的资源。
   game.load.image("sky","assets/sky.png");
   game.load.image("ground","assets/platform.png");
   //在加载精灵的时候,第一个为宽,第二个数字为高。 
   game.load.spritesheet("player","assets/dude.png",32,48);
   game.load.image('star','assets/star.png');
  }
  var platform;//定义所有的地面版块
  var stars;//星星组
  var players;//定义用户
  var keys;//接受按键
  var score = 0;//总分数
    var scoreText;//分数的标题
  function create()//创建场景
  {
   game.physics.startSystem(Phaser.Physics.ARCADE);//记得开启物理引擎
   //加载天空
   game.add.sprite(0,0,'sky');
   //加载文本
   scoreText = game.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: '#000' })
   game.add.text(316,16 , '喂饱虎牙妹', { fontSize: '32px', fill: '#046' })
   //加载大地,设置大地的物理属性,设置大地不动
   platform = game.add.group();//如果要分组的话,必须要先 game.add.group();
   platform.enableBody = true;//设置物体在空间是要占空间的,是存在的。
   var grounds = platform.create(0,game.world.height - 64,'ground');
   grounds.scale.setTo(2,2);//设置图片的缩放,只能对单个图片操作
   grounds.body.immovable = true;//immovable 只能对单个的物体操作。 谨记。
   //加载其它大地组。
   var obstacle = platform.create(400,400,'ground');
   obstacle.body.immovable = true;//immovable 的意思是固定不动。
   obstacle = platform.create(-150,260,'ground');
   obstacle.body.immovable = true;
   obstacle = platform.create(650,100,'ground');
   obstacle.body.immovable = true;
   obstacle = platform.create(300,152,'ground');
   obstacle.body.immovable = true;
   obstacle.scale.setTo(0.5,1);
   //加载人物
   players = game.add.sprite(10,game.world.height - 150,'player');
   game.physics.arcade.enable(players);//给人物添加物理属性
   players.enableBody = true;
   players.body.gravity.y = 300;//设置Y方向的重力
   players.body.collideWorldBounds = true;//设置任务不会离开屏幕
   players.animations.add('left', [0, 1, 2, 3], 10, true);//添加左边的动画。
   players.animations.add('right', [5, 6, 7, 8], 10, true);
   //加载星星物品
   stars = game.add.group();
   stars.enableBody = true;
   for (var i = 0; i <= 13; i++){
    var star = stars.create(i * 50,0,'star');
    game.physics.arcade.enable(star);
    star.body.gravity.y = 500;
    star.body.bounce.y = 0.7 + Math.random() * 0.2;
    star.body.bounce.x = 0.6 + Math.random() * 0.2;
   }
   //创建按键。
   keys = game.input.keyboard.createCursorKeys();
  }
  function update()//游戏运行状态
  {
   //创建碰撞检测功能。 overlap 方法可以引入一个函数。 
   game.physics.arcade.collide(players, platform); 
   game.physics.arcade.overlap(players, stars, over, null, this); 
   game.physics.arcade.collide(stars, platform); 
   players.body.velocity.x = 0;
   if(keys.left.isDown){
    players.body.velocity.x = -150;
    players.animations.play('left');
   }else if(keys.right.isDown){
    players.body.velocity.x = 150;
    players.animations.play('right');
   }else{
    players.animations.stop();//人物停止运动
       players.frame = 4;//定位在第几张
   }
   if (keys.up.isDown && players.body.touching.down) {
       players.body.velocity.y = -350;
    }
  }
  function over(players, stars)
  {
   stars.kill();
   score += 10;
     scoreText.text = 'Score: ' + score;
  }
 </script>
</body>

www.mybbzy.com

冰斌棒博客笔记

本文地址:http://mybbzy.com/?id=29
版权声明:本文为原创文章,版权归 冰斌棒 所有,欢迎分享本文,转载请保留出处!

发表评论


表情

还没有留言,还不快点抢沙发?