我正在創建的游戲不需要任何物理,但是當您懸停/單擊精靈時,您可以使用 sprite.setInteractive({cursor: "pointer"});, sprite.on('pointermove' ,函式(活動指標){...});和類似的。
我在互動區域遇到了一些問題,想通過顯示可互動的“區域”來除錯它。但是,我只能找到與 Arcade Physics 相關的方法。有沒有辦法在沒有物理的情況下在我的可互動區域周圍獲得類似除錯大綱的東西?
uj5u.com熱心網友回復:
開箱即用,沒有物理,我不知道任何方法,但是可以通過一個小的輔助函式來獲得這個功能/特性。(但也許有一些東西,因為移相器是一個非常廣泛的框架。但我也找不到任何東西)。
像這樣的東西,可以做到這一點,并且可以重復使用:
function debugSpriteArea(scene, sprite){
let debugRect = scene.add.rectangle(
sprite.x, sprite.y,
sprite.displayWidth, sprite.displayHeight,
0xff0000).setOrigin(sprite.originX,
sprite.originY);
debugRect.setDepth(-1);
}
這里是幫助功能:
let Scene = {
preload ()
{
this.load.spritesheet('brawler', 'https://labs.phaser.io/assets/animations/brawler48x48.png', { frameWidth: 48, frameHeight: 48 });
},
create ()
{
// Animation set
this.anims.create({
key: 'walk',
frames: this.anims.generateFrameNumbers('brawler', { frames: [ 0, 1, 2, 3 ] }),
frameRate: 8,
repeat: -1
});
const cody = this.add.sprite(200, 100, 'brawler')
.setOrigin(0.5);
debugSpriteArea(this, cody);
cody.play('walk');
cody.setInteractive();
this.mytext = this.add.text(10, 10, 'No Hit', { fontFamily: 'Arial' });
cody.on('pointerdown', function (pointer) {
let originXOffset = cody.displayWidth * cody.originX;
let originYOffset = cody.displayHeight * cody.originY;
let x = (pointer.x - cody.x originXOffset ) / (cody.displayWidth / cody.width)
let y = (pointer.y - cody.y originYOffset) / (cody.displayHeight / cody.height);
if(cody.anims && cody.anims.currentFrame){
let currentFrame = cody.anims.currentFrame;
let pixelColor = this.textures.getPixel(x, y, currentFrame.textureKey, currentFrame.textureFrame);
if(pixelColor.a > 0) {
this.mytext.text = 'hit';
} else {
this.mytext.text = 'No hit';
}
}
}, this);
}
};
function debugSpriteArea(scene, sprite){
let debugRect = scene.add.rectangle(
sprite.x, sprite.y,
sprite.displayWidth, sprite.displayHeight,
0xff0000).setOrigin(sprite.originX,
sprite.originY);
debugRect.setDepth(-1);
}
const config = {
type: Phaser.AUTO,
width: 400,
height: 200,
scene: Scene
};
const game = new Phaser.Game(config);
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/phaser.js"></script>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/436162.html
標籤:javascript 调试 移相器框架
