[GODOT4] AnimatedSprite2D ノードの使い方とスクリプトからの制御

Godot Engineで使用するノードに関しての備忘録です。

この記事はGeminiを活用して作成しました。

はじめに

Godot 4で2Dゲームを作る際、キャラクターにパラパラアニメ（スプライトシートや連番画像）を適用する最も手軽なのが AnimatedSprite2D ノードを使う方法です

この記事では、AnimatedSprite2Dの基本的なセットアップから、スクリプト（GDScript）を使ってアニメーションを切り替える・制御する実践的な方法を記述します

---

1. AnimatedSprite2Dの基本セットアップ

まずはノードを配置し、アニメーションデータをインポートする手順です

1-1. ノードの追加とSpriteFramesの作成

1. シーンに AnimatedSprite2D ノードを追加します
2. インスペクター側にある Sprite Frames プロパティの [空] をクリックし、新規 SpriteFrames を選択します
3. 作成された SpriteFrames をもう一度クリックすると、画面下部に 「アニメーション」パネル が開きます

1-2. アニメーションのインポート

アニメーションパネルでは、以下の2つの方法で画像を読み込めます

• 連番画像（1枚ずつのファイル）の場合
  • パネル上の「フォルダからフレームを追加」ボタン（ファイルのアイコン）を押し、対象の画像を複数選択して読み込みます
    

• スプライトシート（1枚にまとまった画像）の場合

  • 「グリッドからフレームを追加」ボタン（チェス盤のようなアイコン）を押し、画像を選択します
    

  • フレームの分割設定を行います。格子状のフレーム選択ダイアログが表示されています。スプライトシートの構成に合わせて、水平（列）と垂直（行）の数値やX、Yのサイズを入力します（例：横4枚・縦3枚なら、水平「4」、垂直「3」）

  • フレームの追加: マウスでアニメーションさせるフレームを順番に選択するか、「すべてのフレームを選択/消去」ボタンを押して全フレームをハイライトさせ、「〇〇フレームを追加」をクリックします

格子状のフレーム選択ダイアログ

💡 Tips: アニメーションの速度を変えたい場合は、パネル内にある FPS（行当たりのフレーム数、デフォルトは5）の数値を調整してください（早くする場合は上げる）。また、ループさせたくない場合は Loop ボタンをオフ（デフォルトでオン）にしておきます

---

2. スクリプト（GDScript）からの基本制御

アニメーションの準備ができたら、コードから再生や停止、切り替えを行ってみましょう

再生と停止

extends CharacterBody2D

# 子ノードのAnimatedSprite2Dを格納
@onready var _animated_sprite = $AnimatedSprite2D

func _ready():
    # アニメーションを再生
    _animated_sprite.play("walk")

func _process(delta):
    if some_condition: # 例えば
        # アニメーションを停止
        _animated_sprite.stop()

アニメーションの切り替え

キャラクターの移動状態に合わせてアニメーションを切り替える典型的な例です

func update_animation(velocity: Vector2):
    if velocity.x != 0: # 動いている間
        _animated_sprite.play("run")
        # 進行方向（左右）に合わせて画像を反転させる
        _animated_sprite.flip_h = velocity.x < 0
    else:
        _animated_sprite.play("idle")

⚠️ Godot 4の注意点
play() メソッドは すでにそのアニメーションが再生されている場合は無視される（最初からリプレイされない） 仕様になっています
そのため、毎フレーム play("run") を呼び出しても、アニメーションが最初の1フレーム目でフリーズすることはありません。安心して _process や _physics_process 内で呼び出せます

---

3. 実践で役立つ応用テクニック

3-1. アニメーションの終了を検知する（シグナル）

「攻撃アニメーションが終わったら、通常状態（idle）に戻したい」というケースは非常に多いです
この場合、AnimatedSprite2D が持つ animation_finished シグナルを利用します

エディタのノードタブから接続するか、コードで以下のように記述します

func _ready():
    # シグナルをコードから接続
    _animated_sprite.animation_finished.connect(_on_animation_finished)

func attack():
    _animated_sprite.play("attack")

func _on_animation_finished():
    # 終わったアニメーションが "attack" だったら idle に戻す
    if _animated_sprite.animation == "attack":
        _animated_sprite.play("idle")

3-2. 特定のフレームを狙って処理を実行する

「攻撃アニメーションの3フレーム目で、実際に攻撃判定（当たり判定）を発生させたい」といった場合は、frame_changed シグナルが便利です

func _ready():
    _animated_sprite.frame_changed.connect(_on_frame_changed)

func _on_frame_changed():
    # 現在再生中のアニメーションと、そのフレーム数をチェック
    if _animated_sprite.animation == "attack" and _animated_sprite.frame == 3:
        execute_hitbox() # 自作の攻撃判定発生関数

---

まとめ：AnimationPlayerとの使い分けは？

Godotにはもう一つ、AnimationPlayer という強力なアニメーションノードがあります。どちらを使うべきか迷ったら、以下の基準で選ぶのがおすすめです

ノード名	向いている用途
AnimatedSprite2D	2Dのパラパラアニメ、シンプルなキャラクター、エフェクトなど。設定がとにかく爆速で楽
AnimationPlayer	座標移動、回転、拡大縮小、当たり判定の有効/無効化、音声再生など、画像以外のプロパティも同時にアニメーションさせたい時

基本的には、グラフィックのパラパラアニメーションは AnimatedSprite2D でサクッと作り、より複雑な挙動（コンボ攻撃のタイムラインなど）が必要になったら AnimationPlayer（またはそれらを管理する AnimationTree）へステップアップしていくのが良いでしょう

快適なGodot 4ライフを！

---

参考リンク

• Godot Docs: AnimatedSprite2D 公式ドキュメント