Phaser:如何修复重启功能的延迟,我正在使用 window.setTimeout
Phaser: How to fix the delay of the restart function, i am using window.setTimeout
var config = {
type: Phaser.AUTO,
width: 1900,
height: 1000,
physics: {
default: 'arcade',
arcade: {
gravity: { y: 300 },
debug: false
}
},
scene: {
preload: preload,
create: create,
update: update
}
};
var main = document.getElementById("startBtn")
var gameOver
score = 0;
function start() {
game = new Phaser.Game(config);
main.innerHTML = ''
score = 0;
}
function preload() {
this.load.image('Background', 'assets/Background.jpg');
this.load.image('ground', 'assets/platform.png');
this.load.image('coin', 'assets/coin.png');
this.load.image('redCoin', 'assets/redCoin.png');
this.load.spritesheet('monkey',
'assets/monkey.png',
{ frameWidth: 600, frameHeight: 720 }
);
}
var platforms;
var score = 0;
var scoreText;
function create() {
this.add.image(500, 275, 'Background').setScale(3);
this.w = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.W)
this.a = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.A)
this.s = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.S)
this.d = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.D)
platforms = this.physics.add.staticGroup();
platforms.create(200, 650, 'ground').setScale(0.15).refreshBody();
platforms.create(600, 400, 'ground').setScale(0.15).refreshBody();
platforms.create(1600, 650, 'ground').setScale(0.15).refreshBody();
platforms.create(750, 100, 'ground').setScale(0.15).refreshBody();
platforms.create(850, 750, 'ground').setScale(0.15).refreshBody();
platforms.create(100, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(400, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(700, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1000, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1300, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1600, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1900, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1800, 800, 'ground').setScale(0.15).refreshBody();
platforms.create(250, 250, 'ground').setScale(0.15).refreshBody();
platforms.create(1000, 500, 'ground').setScale(0.15).refreshBody();
platforms.create(1150, 220, 'ground').setScale(0.15).refreshBody();
player = this.physics.add.sprite(100, 450, 'monkey').setScale(0.075);
this.physics.add.collider(player, platforms);
player.setBounce(0.2);
player.setCollideWorldBounds(true);
this.anims.create({
key: 'left',
frames: this.anims.generateFrameNumbers('monkey', { start: 0, end: 3 }),
frameRate: 10,
repeat: -1
});
this.anims.create({
key: 'turn',
frames: [{ key: 'monkey', frame: 4 }],
frameRate: 20
});
this.anims.create({
key: 'right',
frames: this.anims.generateFrameNumbers('monkey', { start: 5, end: 8 }),
frameRate: 10,
repeat: -1
});
coins = this.physics.add.group({
key: 'coin',
repeat: 10,
setXY: { x: 12, y: 0, stepX: 150 }
});
coins.children.iterate(function (child) {
child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
child.setScale(0.05)
});
this.physics.add.collider(coins, platforms);
this.physics.add.overlap(player, coins, collectCoin, null, this);
redCoins = this.physics.add.group();
this.physics.add.collider(redCoins, platforms);
this.physics.add.collider(player, redCoins, hitredCoin, null, this);
scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '64px', fill: 'rgb(85, 1, 1)' });
}
function update() {
cursors = this.input.keyboard.createCursorKeys();
if (cursors.left.isDown) {
player.setVelocityX(-160);
player.anims.play('left', true);
}
else if (cursors.right.isDown) {
player.setVelocityX(160);
player.anims.play('right', true);
}
else {
player.setVelocityX(0);
player.anims.play('turn');
}
if (cursors.up.isDown && player.body.touching.down) {
player.setVelocityY(-330);
}
}
function collectCoin(player, coin) {
coin.disableBody(true, true);
score += 1;
scoreText.setText('Score: ' + score);
if (coins.countActive(true) === 0) {
coins.children.iterate(function (child) {
child.enableBody(true, child.x, 0, true, true);
});
var x = (player.x < 400) ? Phaser.Math.Between(400, 800) : Phaser.Math.Between(0, 400);
var redCoin = redCoins.create(x, 16, 'redCoin').setScale(0.05);
redCoin.setBounce(1);
redCoin.setCollideWorldBounds(true);
redCoin.setVelocity(Phaser.Math.Between(-200, 200), 20);
}
}
function hitredCoin(player, redCoin) {
this.physics.pause();
player.setTint(0xff0000);
player.anims.play('turn');
gameOver = true;
window.setTimeout(restart, 3000);
}
function restart () {
this.scene.stop();
this.scene.start();
}
这段代码是我的游戏,它不起作用,因为你死后不能重生,延迟不起作用。我想帮助修复调用重启函数的 hitredcoin 函数结束时的时间延迟。请帮我解决这个问题
可能是因为我用的是javascript的延时器,如果是请告诉我如何换成phaser版本
请帮我解决这个问题,我真的需要我的游戏正常运行
问题是 this
上下文没有设置。
您只需使用 bind
函数即可完成此操作。这是文档的 link (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Function/bind)
只需将行更改为:
window.setTimeout(restart.bind(this), 3000);
bind
函数,传递一个object/context(在本例中是phaser场景)给函数,所以它可以被称为this
.
如果您想使用移相器 delayedCall
功能,您必须将行替换为 (link 文档 https://photonstorm.github.io/phaser3-docs/Phaser.Time.Clock.html ):
this.time.delayedCall(3000, restart, null, this);
- the first parameter is the time in ms: 3000
- the second parameter is the function to call: restart
- the third parameter are arguments, that should be passed to the passed function: null
- the last parameter is the context, for the passed function: this (the current scene)
var config = {
type: Phaser.AUTO,
width: 1900,
height: 1000,
physics: {
default: 'arcade',
arcade: {
gravity: { y: 300 },
debug: false
}
},
scene: {
preload: preload,
create: create,
update: update
}
};
var main = document.getElementById("startBtn")
var gameOver
score = 0;
function start() {
game = new Phaser.Game(config);
main.innerHTML = ''
score = 0;
}
function preload() {
this.load.image('Background', 'assets/Background.jpg');
this.load.image('ground', 'assets/platform.png');
this.load.image('coin', 'assets/coin.png');
this.load.image('redCoin', 'assets/redCoin.png');
this.load.spritesheet('monkey',
'assets/monkey.png',
{ frameWidth: 600, frameHeight: 720 }
);
}
var platforms;
var score = 0;
var scoreText;
function create() {
this.add.image(500, 275, 'Background').setScale(3);
this.w = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.W)
this.a = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.A)
this.s = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.S)
this.d = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.D)
platforms = this.physics.add.staticGroup();
platforms.create(200, 650, 'ground').setScale(0.15).refreshBody();
platforms.create(600, 400, 'ground').setScale(0.15).refreshBody();
platforms.create(1600, 650, 'ground').setScale(0.15).refreshBody();
platforms.create(750, 100, 'ground').setScale(0.15).refreshBody();
platforms.create(850, 750, 'ground').setScale(0.15).refreshBody();
platforms.create(100, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(400, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(700, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1000, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1300, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1600, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1900, 950, 'ground').setScale(0.15).refreshBody();
platforms.create(1800, 800, 'ground').setScale(0.15).refreshBody();
platforms.create(250, 250, 'ground').setScale(0.15).refreshBody();
platforms.create(1000, 500, 'ground').setScale(0.15).refreshBody();
platforms.create(1150, 220, 'ground').setScale(0.15).refreshBody();
player = this.physics.add.sprite(100, 450, 'monkey').setScale(0.075);
this.physics.add.collider(player, platforms);
player.setBounce(0.2);
player.setCollideWorldBounds(true);
this.anims.create({
key: 'left',
frames: this.anims.generateFrameNumbers('monkey', { start: 0, end: 3 }),
frameRate: 10,
repeat: -1
});
this.anims.create({
key: 'turn',
frames: [{ key: 'monkey', frame: 4 }],
frameRate: 20
});
this.anims.create({
key: 'right',
frames: this.anims.generateFrameNumbers('monkey', { start: 5, end: 8 }),
frameRate: 10,
repeat: -1
});
coins = this.physics.add.group({
key: 'coin',
repeat: 10,
setXY: { x: 12, y: 0, stepX: 150 }
});
coins.children.iterate(function (child) {
child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
child.setScale(0.05)
});
this.physics.add.collider(coins, platforms);
this.physics.add.overlap(player, coins, collectCoin, null, this);
redCoins = this.physics.add.group();
this.physics.add.collider(redCoins, platforms);
this.physics.add.collider(player, redCoins, hitredCoin, null, this);
scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '64px', fill: 'rgb(85, 1, 1)' });
}
function update() {
cursors = this.input.keyboard.createCursorKeys();
if (cursors.left.isDown) {
player.setVelocityX(-160);
player.anims.play('left', true);
}
else if (cursors.right.isDown) {
player.setVelocityX(160);
player.anims.play('right', true);
}
else {
player.setVelocityX(0);
player.anims.play('turn');
}
if (cursors.up.isDown && player.body.touching.down) {
player.setVelocityY(-330);
}
}
function collectCoin(player, coin) {
coin.disableBody(true, true);
score += 1;
scoreText.setText('Score: ' + score);
if (coins.countActive(true) === 0) {
coins.children.iterate(function (child) {
child.enableBody(true, child.x, 0, true, true);
});
var x = (player.x < 400) ? Phaser.Math.Between(400, 800) : Phaser.Math.Between(0, 400);
var redCoin = redCoins.create(x, 16, 'redCoin').setScale(0.05);
redCoin.setBounce(1);
redCoin.setCollideWorldBounds(true);
redCoin.setVelocity(Phaser.Math.Between(-200, 200), 20);
}
}
function hitredCoin(player, redCoin) {
this.physics.pause();
player.setTint(0xff0000);
player.anims.play('turn');
gameOver = true;
window.setTimeout(restart, 3000);
}
function restart () {
this.scene.stop();
this.scene.start();
}
这段代码是我的游戏,它不起作用,因为你死后不能重生,延迟不起作用。我想帮助修复调用重启函数的 hitredcoin 函数结束时的时间延迟。请帮我解决这个问题
可能是因为我用的是javascript的延时器,如果是请告诉我如何换成phaser版本
请帮我解决这个问题,我真的需要我的游戏正常运行
问题是 this
上下文没有设置。
您只需使用 bind
函数即可完成此操作。这是文档的 link (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_objects/Function/bind)
只需将行更改为:
window.setTimeout(restart.bind(this), 3000);
bind
函数,传递一个object/context(在本例中是phaser场景)给函数,所以它可以被称为this
.
如果您想使用移相器 delayedCall
功能,您必须将行替换为 (link 文档 https://photonstorm.github.io/phaser3-docs/Phaser.Time.Clock.html ):
this.time.delayedCall(3000, restart, null, this);
- the first parameter is the time in ms: 3000
- the second parameter is the function to call: restart
- the third parameter are arguments, that should be passed to the passed function: null
- the last parameter is the context, for the passed function: this (the current scene)