在畫布上播放精靈表慢於幀頻

Question

我有一個精靈渲染器，它告訴我的游戲引擎如何渲染精靈。 此類中的update方法每秒被調用約120次。 以這種速度在Sprite表中運行太快。

在我的Sprite類中，我有一個名為duration的屬性，該屬性告訴渲染器Sprite應該播放多少秒。 一旦到達最后一幀，它應該重新開始。

我不確定如何使用每秒運行120次的update以及應該持續x秒直到重新開始的sprite表格來計算該值。

class SpriteRenderer extends Component {

    // The current frame
    public frame: number = 0;
    // The sprite reference
    public sprite: Sprite = null;

    update() {

        // Number of frames in the sprite sheet
        let frames = this.sprite.frames;
        if (frames > 0) {
            // The time in seconds the sprite sheet should play
            let duration = this.sprite.duration;

            if (/* What should go here? */) {
                this.frame++;
                if (this.frame > frames - 1) {
                    this.frame = 0;
                }
            }
        }

    }

}

Answer 1

您可以實現一個控制幀時間的時間變量。 該變量是一個浮點數，一旦變大，就可以進行下一幀並重置該變量。

我從未做過任何類型腳本，但這可能有用。 它至少會讓您了解我在說什么。

如果更新每秒運行120次，則意味着更新每60/120秒運行一次0.5。

現在我們可以將currentTime增加0.5，並檢查currentTime > sprite.duration * 60是否為我認為。 :)

實例：

class SpriteRenderer extends Component {

    // The current frame
    public frame: number = 0;
    // The sprite reference
    public sprite: Sprite = null;
    public currentTime: number = 0.0; //This is the current time.
    public updateTime: number = this.sprite.duration*60; //This is how long the update time is.
    update() {
        this.currentTime += 0.5; //Add to the current time.
        // Number of frames in the sprite sheet
        let frames = this.sprite.frames;
        if (frames > 0) {
            // The time in seconds the sprite sheet should play
            let duration = this.sprite.duration;

            if (this.currentTime > this.sprite.duration*60) { //Check if the current time is more than the wait time.
                this.currentTime = 0.0; //Reset the wait time.
                this.frame++;
                if (this.frame > frames - 1) {
                    this.frame = 0;
                }
            }
        }

    }

}