8方向移動・アニメーション

課題

2Dキャラクターが必要です。アニメーションを含む8方向移動が可能なものが求められます。

解決策

この例では、Isometric: Mini-Crusaderを使用します。これには待機、歩行、攻撃など8方向に対応したアニメーションが含まれています。

アニメーションはフォルダ単位で整理されており、各フレームごとに個別の画像が用意されています。ここではAnimatedSprite2Dを使用し、各アニメーションにはその動作方向に基づいて名前を付けます。例えば、右向きで時計回りに移動するidle0から、同じく時計回りに動くidle7までといった具合です。

キャラクターが移動する際には、動きの方向に基づいて適切なアニメーションを選択します。

マウスを使って移動します。キャラクターは常にマウスの方向を向き、マウスボタンをクリックするとその方向に走り出します。

どのアニメーションを再生するか選択するためには、マウスの方向を取得し、それを同じ範囲（0-7）にマッピングする必要があります。get_local_mouse_position()を使用することで、キャラクターに対するマウスカーソルの位置を取得できます。次にsnappedf()関数を使用して、マウスベクトルの角度を最も近い45度間隔（PI/4ラジアン）にスナップさせると、以下の結果が得られます。

各値を 45°（PI/4 ラジアン）で除算すると、以下のようになります。

最終的には、wrapi()関数を使用して結果の範囲を0-7にマッピングする必要があります。これにより、正しい値が得られます。この値をアニメーション名の末尾に追加します（“idle”、“run"など）。こうすることで、正しく動作するアニメーションが完成します。

func _physics_process(delta):
    current_animation = "idle"

    var mouse = get_local_mouse_position()
    angle = snappedf(mouse.angle(), PI/4) / (PI/4)
    angle = wrapi(int(angle), 0, 8)

    if Input.is_action_pressed("left_mouse") and mouse.length() > 10:
        current_animation = "run"
        velocity = mouse.normalized() * speed
        move_and_slide()
    $AnimatedSprite2D.animation = current_animation + str(a)

動作テストを行ったところ、以下の現象が確認されました：

キーボード入力

マウスの代わりにキーボード操作を使用している場合、押されているキーに基づいて移動角度を取得できます。それ以外の手順は同様の方法で進行します。

func _process(delta):
    current_animation = "idle"
    var input_dir = Input.get_vector("left", "right", "up", "down")
    if input_dir.length() != 0:
        angle = input_dir.angle() / (PI/4)
        angle = wrapi(int(a), 0, 8)
        current_animation = "run"
    velocity = input_dir * speed
    move_and_slide()
    $AnimatedSprite2D.play(current_animation + str(angle))

プロジェクトのダウンロード

プロジェクトコードはこちらからダウンロードできます。https://github.com/godotrecipes/8_direction_animation