【发布时间】:2019-10-08 07:26:13
【问题描述】:
我正在使用 Phaser 框架在 JavaScript 中制作射箭游戏。到目前为止,我已经知道箭头的去向并击中目标,但是如果您希望箭头再次射击,则必须重新加载页面。我怎样才能让它可以多次拍摄?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>TSA Video Game</title>
<script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
<style type="text/css">
body {
margin: 0;
}
</style>
</head>
<body>
<script type="text/javascript">
var config = {
type: Phaser.AUTO,
width: 800,
height: 600,
physics: {
default: 'arcade'
},
scene: {
preload: preload,
create: create,
update: update,
render: render
}
};
//Start the game
var game = new Phaser.Game(config);
function preload ()
{
this.load.image('sky', 'assets/sky.png');
this.load.image('archer', 'assets/archer.png');
this.load.image('target', 'assets/target.png');
this.load.image('ground', 'assets/ground.png');
this.load.image('rings', 'assets/rings.png');
this.load.image('arrow', 'assets/arrow.png');
}
function create ()
{
//Load all the images
this.add.image(400, 300, 'sky');
this.add.image(200, 200, 'ground');
this.add.image(530, 365, 'target');
this.add.image(300, 100, 'rings');
//Create the archer/player
this.player = this.physics.add.sprite(100, 410, 'archer');
//Create the arrow to shoot
this.arrow = this.physics.add.sprite(100, 430, 'arrow');
//Get keypresses
this.cursors = this.input.keyboard.createCursorKeys();
//Assign input for spacebar
this.spacebar = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.SPACE);
}
function update ()
{
//Declare constants for movement
const moveAmt = 1500;
const moveYamt = 0;
this.player.setDrag(2000);
//Move the player left or right
if (this.cursors.right.isDown)
this.player.setVelocityX(moveAmt);
if (this.cursors.left.isDown)
this.player.setVelocityX(-moveAmt);
//Rotation of the player
if (this.cursors.up.isDown && this.player.angle > -45) {
this.player.angle -= 1;}
if (this.cursors.down.isDown && this.player.angle < 0) {
this.player.angle += 1;}
//Shooting with the spacebar
if (Phaser.Input.Keyboard.JustDown(this.spacebar)) {
this.arrow.setVelocityX(moveAmt);
this.arrow.setVelocityY(moveYamt);
}
//Stop the arrow once it hits the bullseye
if (this.arrow.x > 480) {
this.arrow.x = 480;
this.arrow.setVelocityX(0);
this.arrow.setVelocityY(0);
}
}
function render() {
}
</script>
</body>
</html>
我尝试创建三个箭头,并在“if (Phaser.Keyboard.Justdown”语句中嵌套另一个 if 语句,但这不起作用。
【问题讨论】:
-
您需要创建一个对象数组。每个对象都包含该箭头所需的所有信息。
-
@Intervalia 那会是什么样子?你不必为我写,但你能举个例子吗?无论我想要多少箭头,我都必须粘贴箭头的代码吗?
标签: javascript html game-engine phaser-framework