第二部分 显示对象（粒子 瓦片地图）

学习笔记：粒子系统部分。这部分效果在上，代码在下面。

1 粒子系统

效果

代码：

var game = new Phaser.Game(800, 500, Phaser.AUTO, 'container', state);

function state(){
	this.init = function(){
		game.scale.pageAlignHorizontally = true; //水平居中
		game.scale.pageAlignVertically = true; //垂直居中
	}

	this.preload = function(){
		game.load.image('bubble', 'asset/bubble.png');
	}

	this.create = function(){
		var emitter = game.add.emitter(game.width/2, game.height/2, 50);
		emitter.makeParticles('bubble');

		//emitter.setXSpeed(500, 1000);//X轴上的速度，最小值最大值
		//emitter.setYSpeed(500, 1000);
		emitter.setScale(0, 1, 0, 1, 3000);//缩放： X最小 X最大 Y最小 Y最大 过渡时间（从最小值到最大值的过渡）
		emitter.setAlpha(0, 1, 3000);//最小值 最大值，有过渡动画的时间
		emitter.setRotation(100, 200);//设置角速度

		emitter.start(true, 3000, 1000, 50);//start方法发射粒子：一次一个还是一次全部，生存时间，发射间隔，发射数量

	}

}

效果

代码

var game = new Phaser.Game(800, 500, Phaser.AUTO, 'container', state);

function state(){
	this.init = function(){
		game.scale.pageAlignHorizontally = true; //水平居中
		game.scale.pageAlignVertically = true; //垂直居中
	}

	this.preload = function(){
		game.load.spritesheet('fruits', 'asset/fruits.png', 32, 32);
	}

	this.create = function(){
		var emitter = game.add.emitter(game.width/2, game.height/2, 100);
		emitter.makeParticles('fruits', [0,1,2,3,4,5,6,7,8,9,10,11]);//会从数组中随机出一个
		emitter.flow(3000, 1000, 50, -1);
		//生存周期（设为0就会永远都不消失），多久一次，每次多少个 ，总共多少个粒子（值为-1是无数我个）
	}

}

效果

代码

var game = new Phaser.Game(800, 500, Phaser.AUTO, 'container', state);

function state(){
	this.init = function(){
		game.scale.pageAlignHorizontally = true; //水平居中
		game.scale.pageAlignVertically = true; //垂直居中
	}

	this.preload = function(){
		game.load.image('ball', 'asset/ball.png');
	}

	var emitter;

	this.create = function(){
		emitter = game.add.emitter(game.width/2, game.height/2);
		emitter.makeParticles('ball', '', 100, true, true);
		emitter.setYSpeed(-600, -300);
		emitter.setXSpeed(-300, 300);
		emitter.setScale(0.1, 1, 0.1, 1, 3000);
		emitter.gravity = 600;//重力加速度
		emitter.bounce.y = 0.8;//反弹强度 1为原高度，0为不反弹
		emitter.flow(0, 3000, 1, 100);
	}

	this.update = function(){
		game.physics.arcade.collide(emitter);
	}
}

2 瓦片地图

var game = new Phaser.Game(800, 400, Phaser.AUTO, 'container', state);

function state(){
	this.init = function(){
		game.scale.pageAlignHorizontally = true; //水平居中
		game.scale.pageAlignVertically = true; //垂直居中
	}

	this.preload = function(){
		game.load.tilemap('mario_map', 'asset/tilemap/mario.json', null, Phaser.Tilemap.TILED_JSON);
		game.load.image('mario', 'asset/tilemap/mario.png');
	}


	this.create = function(){
		var map = game.add.tilemap('mario_map');//创建地图Map，
		map.addTilesetImage('super_mario', 'mario');//第一个参数是用TILED创建地图时那个瓦片图片的名字，第二个参数是你在这个游戏中加载进来的瓦片图片的KEY
		var layer = map.createLayer('world');//创建层，这个层就是你在TILED中层的名字
	
	}

}

对瓦片地图的一些操作

var game = new Phaser.Game(800, 400, Phaser.AUTO, 'container', state);

function state(){
	this.init = function(){
		game.scale.pageAlignHorizontally = true; //水平居中
		game.scale.pageAlignVertically = true; //垂直居中
	}

	this.preload = function(){
		game.load.tilemap('mario_map', 'asset/tilemap/mario.json', null, Phaser.Tilemap.TILED_JSON);
		game.load.image('mario', 'asset/tilemap/mario.png');
	}


	this.create = function(){
		var map = game.add.tilemap('mario_map');
		map.addTilesetImage('super_mario', 'mario');
		var layer = map.createLayer('world');

		//获取指定位置上的瓦片
		var tile = map.getTile(0, 24);

		//在指定的位置设置指定的瓦片
		map.putTile(tile, 0, 0);

		//在指定区域填充指定的瓦片，第一个参数是瓦片的索引，从1开始，后面的是左上和右下
		//map.fill(12, 0, 0, 20, 20);
		
		//瓦片的复制和粘贴
		//var tiles = map.copy(0, 19, 5, 5);
		//map.paste(0, 0, tiles);

		//在指定区域内用一种瓦片替换另一种瓦片
		//map.replace(1, 12);
	
	}

}

加进人物和控制及碰撞

var game = new Phaser.Game(800, 400, Phaser.AUTO, 'container', state);

function state(){
	var layer, player, cursors;
	this.init = function(){
		game.scale.pageAlignHorizontally = true; //水平居中
		game.scale.pageAlignVertically = true; //垂直居中
	}

	this.preload = function(){
		game.load.tilemap('mario_map', 'asset/tilemap/mario.json', null, Phaser.Tilemap.TILED_JSON);
		game.load.image('mario', 'asset/tilemap/mario.png');
		game.load.image('player', 'asset/tilemap/player.png');
	}


	this.create = function(){
		var map = game.add.tilemap('mario_map');
		map.addTilesetImage('super_mario', 'mario');
		layer = map.createLayer('world');
		layer.resizeWorld(); //调整世界大小为地图大小
		
        //设置需要碰撞的瓦片
		map.setCollisionBetween(15, 16);
	    map.setCollisionBetween(20, 25);
	    map.setCollisionBetween(27, 29);
	    map.setCollision(40);


		game.physics.startSystem(Phaser.Physics.ARCADE);//物理引擎
	    player = game.add.sprite(32, 32, 'player');
	    game.physics.enable(player);//为游戏人物启用物理引擎
	    game.physics.arcade.gravity.y = 250;//重力
	    player.body.bounce.y = 0.2;//碰撞后弹回的设置
	    game.camera.follow(player);//摄像机跟随人物

	    cursors = game.input.keyboard.createCursorKeys();//键盘控制快捷方法
	}

	this.update = function(){
		game.physics.arcade.collide(player, layer);//碰撞检测
	    
	    player.body.velocity.x = 0;
	    if (cursors.up.isDown){
	        if (player.body.onFloor()){
	            player.body.velocity.y = -250;
	        }
	    }
		if (cursors.left.isDown){
	        player.body.velocity.x = -150;
	    }else if (cursors.right.isDown){
	        player.body.velocity.x = 150;
	    }
	}


}