Phaser计时器激活的事件。如何?

huangapple go评论61阅读模式
英文:

Phaser timer activated events. How?

问题

我正在尝试制作一个游戏,其中某些事情是基于不断增加的计时器而发生的。例如,在特定屏幕上经过一定时间后,某些文本、图像或可点击按钮才会出现。或者当计时器等于某些数字时,可能会在屏幕上短暂地闪现一张图片。

不幸的是,我不知道如何实现这个功能。有人可以给我展示一个解决方案吗?最好有示例。

如果有帮助的话,我正在使用VSCode中的Phaser 3。

英文:

I'm trying to make a game where certain things happen based on a timer that keeps going up. For example, certain text, images, or clickable buttons only appear after a certain amount of time has passed on a specific screen. Or maybe an image briefly flashes onto the screen when the timer equals certain numbers.

Unfortunately, I have got no clue how to make this happen. Can anyone show me a solution? Examples are perfered.

If it helps, I'm using Phaser 3 in VSCode.

答案1

得分: 0

我建议查看时间文档官方主页上的时间示例

基本上,你只需要使用this.time.addEvent( ... );

更新:这里是一个简短的演示:

document.body.style = 'margin:0;';

var config = {
    type: Phaser.AUTO,
    width: 536,
    height: 183,
    scene: {
        create,
        update
    }
};

function create() {
    this.label1 = this.add.text(50, 50, '计时器: 0')
        .setScale(2.5)
        .setOrigin(0)
        .setStyle({ fontStyle: 'bold', fontFamily: 'Arial' });

    this.label2 = this.add.text(50, 100, '更新计时器: 0')
        .setScale(2.5)
        .setOrigin(0)
        .setStyle({ fontStyle: 'bold', fontFamily: 'Arial' });

    this.currentAppTime = 0;

    let counter = 1;

    this.time.addEvent({
        delay: 1500,
        callback: () => this.label1.setText(`计时器: ${counter++}`),
        callbackScope: this,
        loop: true
    });
}

function update(time, delta) {
    let helperTime = Math.floor(time / 1000);
    if (helperTime > this.currentAppTime) {
        this.currentAppTime = helperTime;
        this.label2.setText(`更新计时器: ${this.currentAppTime}`)
    }
}

new Phaser.Game(config);
英文:

I sugest checking out the time documentation, or the time examples on the official homepage.

Basically you just need to use this.time.addEvent( ... );

UPDATED Herer a short demo:

<!-- begin snippet: js hide: false console: false babel: false -->

<!-- language: lang-js -->

document.body.style = &#39;margin:0;&#39;;

var config = {
    type: Phaser.AUTO,
    width: 536,
    height: 183,
    scene: {
        create,
        update
    }
}; 

function create () {
    this.label1 = this.add.text(50, 50, &#39;Timer: 0&#39;)
        .setScale(2.5)
        .setOrigin(0)
        .setStyle({fontStyle: &#39;bold&#39;, fontFamily: &#39;Arial&#39;});
        
    this.label2 = this.add.text(50, 100, &#39;Update Timer: 0&#39;)
        .setScale(2.5)
        .setOrigin(0)
        .setStyle({fontStyle: &#39;bold&#39;, fontFamily: &#39;Arial&#39;});
    
    this.currentAppTime = 0;
  
    let counter = 1;
  
    this.time.addEvent({
        delay: 1500, 
        callback: () =&gt; this.label1.setText(`Timer: ${counter++}` ),
        callbackScope: this, 
        loop: true 
    });
}

function update(time, delta){
    let helperTime = Math.floor(time / 1000);
    if(helperTime &gt; this.currentAppTime){
        this.currentAppTime = helperTime;
        this.label2.setText(`Update Timer: ${this.currentAppTime}` )
    }
}

new Phaser.Game(config);

<!-- language: lang-html -->

&lt;script src=&quot;//cdn.jsdelivr.net/npm/phaser/dist/phaser.min.js&quot;&gt;&lt;/script&gt;

<!-- end snippet -->

huangapple
  • 本文由 发表于 2023年6月2日 06:24:56
  • 转载请务必保留本文链接:https://go.coder-hub.com/76386086.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定