Phaser3旋轉動畫

Question

我正在嘗試創建一個簡單的來回擺動的動畫效果。 我只使用一個圖像精靈，下面有代碼，但是動畫僅傾斜到45度角，然后完全停止。 我可能做錯了什么？

    var title = new Phaser.Scene("GameTitle");
var pendulum;
var direction;
title.create = function(){
    pendulum = this.add.sprite(200, 0, 'titlePendulum').setOrigin(0.5, 0).setScale(1.8).setRotation(79);
    direction = "left";
};

title.update = function(){
    console.log(pendulum.angle.toFixed(0));
    swing(direction);
    if(pendulum.angle.toFixed(0) == 71){
        swing ("right");
    }
    if(pendulum.angle.toFixed(0) == -76){
        swing("left");
    }
};

function swing(dir){
    if(dir == "left"){
        if(pendulum.angle.toFixed(0) == 71){
            swing("right");
        }else{
            pendulum.angle +=1.5;
        }

    }else{
        if(pendulum.angle.toFixed(0) > -80){
            pendulum.angle -= 1.5;
        }
        if(pendulum.angle.toFixed(0) == -76){
            swing("left");
        }
    }
}

Answer 1

我注意到您在兩個單獨的if語句中檢查pendulum.angle是否大於或等於80。 但是80不能被1.5整除，角度的值可能是.. 76, 77.5, 79, 80.5 ..並且條件pendulum.angle.toFixed(0) == 80將永遠不成立。

另外，函數參數的名稱為dir但您需要檢查direction 。

我很確定這是導致問題的原因。 即使不是那樣，當您檢查條件可以是一件事或另一件事時，而不是使用兩個單獨的if語句，使用if-else還是更好（更優雅，更“干凈”）。

因此，將您的代碼更改為如下所示：

function swing(dir) {
    if (dir == "left") { // check parameter, not the direction global var
        if (pendulum.angle.toFixed(0) < 80) {
            pendulum.angle +=1.5;
        } else {
            swing("right");
        }
    } else { // dir == "right"
        if (pendulum.angle.toFixed(0) > -80) {
            pendulum.angle -= 1.5;
        } else {
            swing("left");
        }
    }
}