Godot Engineで使用するノードに関するの備忘録です。
この記事はGeminiを活用して作成しました。
1. はじめに
Sprite2D は、2Dゲームで画像(テクスチャ)を表示するための最も基本的なノードです。
アニメーションさせない単一の画像を表示するのに特化しており、背景、プレイヤーキャラクター、アイテムの見た目などを表現するのに使われます。Playerノードや敵、アイテムのルートノードの子として広く使われます。
主な用途
- プレイヤー、敵、アイテム、NPCの画像表示
- 静止した背景や前景
- アイコンやUI要素
- エフェクトの静止画像
⚠️ 注意:
Sprite2D単体では動作しません。表示する画像を定義するために、インスペクターの Texture プロパティに画像を割り当てる必要があります。
2. 代表的なプロパティ
インスペクターでよく設定する、Sprite2D の代表的なプロパティです。
| プロパティ名 | 説明 |
|---|---|
| Texture | 表示する画像を選択(画像をドラッグ)。 |
| Centered |
true の時、画像をノードの中心に配置します。デフォルトはON。 |
| Offset | 画像の中心からの表示オフセット量。 |
| Hframes / Vframes | 画像をスプライトシートとして分割する場合のフレーム数。 |
3. 代表的なシグナル
Sprite2D は、主に静止画像の表示のみを担当するため、よく利用するシグナルはありません。
4. 使い方(コインの表示例)
ここでは、Step 1〜4でアイテムとしての「コイン」を表示する手順を解説します。
📌 実装の全体フロー
- Step 1: ノードの作成(コインを表示するノードを追加する)
- Step 2: 画像の割り当て(コインのテクスチャを設定する)
- Step 3: 中心設定の調整(表示位置を調整する)
- Step 4: [コード例] 向きの変更(GDScriptで画像を反転させる)
🛠️ Step 1. ノード構成の作成
コインを配置される「シーン」を作ります。
- 新規シーンを作成し、ルートノードを
Node2D(名前:Coin) とします -
Coinの子ノードとして、Sprite2D を追加します (名前:CoinSprite) - これからこのノードに、インスペクターで画像を割り当てます
【シーン構成】
Coin (Node2D)
└── CoinSprite (Sprite2D)
🖼️ Step 2. 画像の割り当て
コインの画像ファイルを Sprite2D ノードに設定します。
- CoinSprite (Sprite2D) ノードを選択します
- インスペクターで Texture プロパティを見つけます
- ファイルドックからコインの画像ファイル (例: coin.png) を Texture プロパティにドラッグ&ドロップします。これで画面にコインが表示されます。
🎯 Step 3. 中心設定の調整
画像の中心をノードの原点に合わせるか調整します。
- インスペクターで Centered プロパティを確認します。
これが On の時、コインの中心がノードの位置となります。アイテムなどでは通常このままで良いでしょう。
逆に、画像の左上を起点にしたい場合は、Centered を Off にします。
💻 Step 4. コード例(画像の反転)
ゲーム中にGDScriptを使って、画像の向きをプログラムで反転させる例です。
CoinSprite にスクリプトをアタッチし、以下のように記述します。
extends Sprite2D
# 1/10秒ごとに画像を反転させる
func _process(delta):
# 向きを反転させる (flip_h プロパティを使用)
if Input.is_action_just_pressed("ui_accept"): # スペースキーを押したとき
flip_h = !flip_h
