Godot 音シュー12「シーンのインスタンスとアニメ 1/2」
エフェクトにこだわるとゲームが先に進まないが、「Good」とか「Miss」とか画面に表示されるようにしてみた。しかもちょっとだけアニメする。考え方は「Good」や「Miss」がアニメするシーンを作っておいて、そのシーンをノード化して子ノードに追加するだけ。
Goodシーンのアニメ 完成イメージ
こんな感じで、エリアの所からニョキッと「Good」の文字が出てくるシーンを先に作る。(「Miss」の方も同じようにやれば出来るから、これは省略する予定。)
新シーンのノード
まずは、メインパネルの所[+]を押して新規シーンの追加だ。そしたら、ノードを追加していく。出来上がったら適当な名前でセーブ。
- ルートノードは「Control」。位置、大きさなどはイジラナイ。「Node」ノードとかにはしない事。今回は4か所あるエリアの位置により、表示させる場所を変えられるようにするため、プロパティにRectのPositionがある事が大事だ。
- 「Label」ノード。プロパティのTextに"Good"と書き入れる。位置は原点(というか親ノードのポジション)を中心に設定する。回転や拡大・縮小はお好みで。今回はこのノードのプロパティをいじってアニメさせる。
- アニメさせるから当然「AnimationPlayer」ノード。これを付けると、下部パネルが[Animation]に。なってなかったら、クリックで。
Animation
で、「Label」ノードをアニメさせるわけだが、
- 下部パネルが[Animation]になっていることを確認して、
- [新規アニメの作成]ボタンをクリック。
- [アニメの名前どうしますか?]の窓が出るので、適当に名前を入れて[OK]。
- すると、各ノードのプロパティの数値の右横に[鍵(キー)]のアイコンが表示されるようになる。このボタンを押すことで、アニメのトラックにキーを打ち込める。いろいろいじってて、「あれ? [鍵(キー)]のアイコンがねーなー」てな具合になってしまった場合は、下部パネルが[Animation]になっていて、[新規アニメの作成]の状態になっているかどうか確認だ。
基本的に、どんなノードのどんなプロパティでも[キー]アイコンが出る。ってことは、Godotではなんでもかんでもアニメーションさせることが出来るって事だ。すごいねGodot!
キーを打つ前に・・・
この画面、前もどっかで解説してたような気もしないでもないが、、、
- Length(s): アニメの長さを設定する。単位は秒。今回のアニメは"0.5"秒にした。ここの数値を変えると、連動して[4]の薄く塗られている範囲が設定したアニメの長さに変わる。
- Step(s): キーを打てる間隔を設定する。単位は秒。デフォでは"0.1"。つまり、0.1秒毎にキーを打てるという事。今回は特にいじってない。
- この青線の上にキーが打たれる。各ノードのプロパティの数値の右横に[鍵(キー)]のアイコンが表示されてるだろ。それ押した時、この線上にキーが打たれる。この線を動かしたい時は[4]の薄く塗られている範囲上でクリックする。線の動きは[2]で指定した間隔で動く。
- [1]で設定した範囲だけ薄く塗られる。なんか狭いなー、と思ったら、この上で[Ctrl] + [マウスウィールくるくる] で伸びたり縮んだりする。アニメ時間が短い時は広げとくと、各キー間が広がってキーが打ちやすくなるって事。
- ここの丸ポチをスライドさせても[4]の範囲が伸びたり縮んだり。アニメの時間が伸びるわけじゃないから。あくまで、見た目の拡大縮小。
キーを打つ
先ずは、「Label」のScaleのキーを打つ。アニメの始まりは4倍の大きさで表示させ、終わり(0.5秒後)では7倍の大きさで表示させる様にする。
- Scaleの横に出た[キー]アイコンをクリック。これで、さっきの青線の所にキーが打たれるのだが、
- [新しくトラックを作りますよ。]のダイアログが出るので、[Create]する。これは以後、Scaleの変化を記録する場所(トラック)を確保する事を示している。以降Scaleの変化があった場合、このトラックに記録する事になる。1つのプロパティで1つのトラックを使う。違うプロパティの変化は、それぞれ違うトラックで管理する。
- Label:rect_scaleというトラックが作成され、青線上(0秒のとこ)にひし形のポチマークがついた。これがキーだ。
で次に、
- 線を0.5秒の位置にずらし、
- Scaleを7倍にして、[キー]アイコンをクリックすると、
- キーが打たれるのだが、Scaleという同一プロパティの変化なので、同一トラック上に打たれる事になる。
これで、文字のスケールが4倍から7倍になる0.5秒のアニメが出来た。
簡単にまとめると
- 「Animation」ノード追加
- [新規アニメ追加]ボタン
- 青線をキーを打ちたいところに動かして、
- プロパティを好きな様に変えて、
- [キー]アイコンクリックで、
- トラックにキーが打たれる。
- 以下、[3]~[6]を繰り返し。
という感じ。
追加で
文字が大きくなるだけだと寂しいので、表示位置と色の変化も加えてみた。プロパティ毎にトラックが出来るのが分かると思う。
また、トラック名が長くて見切れてる場合は、時間が表示されている行の左(トラック名の欄の上)の[⇔]マークをドラッグするとトラック名表示の欄を広げることが出来る。あと、トラック名の左にあるチェックは、そのトラックが有効という事。
ちなみに、
- [逆再生]ボタン: 今ある青線の位置からアニメを逆再生する。
- [一番最後から逆再生]ボタン: アニメの一番最後から逆再生する。
- [停止]ボタン: そのまま。
- [一番最初から再生]ボタン: アニメの一番最初から再生する。
- [再生]ボタン: 今ある青線の位置からアニメを再生する。
- 青線の位置を指定したい時は、ここに数値を入れてもいいし、[上下]マークのアイコンをクリックしてもいける。
- また、打ったキーを消したい時は、ひし形のマークの上で右クリ、[Remove Selection]。マウスのドラッグで囲めば複数キーを一気に選択できる。
アニメーションパネルの見方はキャラコンの17も参照のこと。
インスタンス
あとは、今作ったシーンをインスタンスさせるんだが、また今度。