もくじ
スコアテキストとゲームオーバーテキストの作成
Text Shadow
Hierarchyウィンドウでコンテキストメニューを表示させ、UI → Textをクリックし、UI TextとしてScoreTextゲームオブジェクトを作成する。チュートリアルビデオと同じようにTextコンポーネントの各パラメータを変更し、文字にドロップシャドウを追加するためにShadowコンポーネントを追加する。( 3.1, 3.2)
3.1 Text - UI
3.2 TextとShadowコンポーネント - UI Text
次にゲームオーバーテキストを追加するため、ScoreTextゲームオブジェクトを複製し、名前をGameOverTextに変更し、Fontサイズとテキスト位置を調整する。また、GameOverTextゲームオブジェクトはInspectorで無効にしておく。後でゲームオーバー時にプログラム側で有効にする処理を追加する。( 3.3, 3.4)
3.3 On - GameOverText
3.4 Off - GameOverText
Game Controller(ゲームコントローラー)の作成
Visual Scripting
HierarchyウィンドウのコンテキストメニューからCreate Emptyを選択し、新規の空オブジェクトを作成する。名前をGameControllerとする。GameControllerゲームオブジェクトにScript Machineコンポーネントを追加し、GameControlという名前でScript Graph Assetを作成し設定する。( 3.5, 3.6)
3.5 Add Component - Script Machine
3.6 GameControl - Script Graph
チュートリアルビデオではGameControlクラスをシングルトンパターンで実装して、Birdが落下したときにゲームオーバーテキストを表示するメソッドをGameControlクラスから呼び出すようにしているのだが、Visual Scriptingではシングルトンパターンは使えない（と思う）のでBirdスクリプトグラフの落下フロー(Die)の続きにゲームオーバーテキストを表示させるSet Activeユニットを直接追加することにする。( 3.7)
もしシングルトンパターンと同等の仕組みをVisual Scriptingで実現したい場合、どのようにすればよいのだろうか。Custom Trigger EventやSuper Unitを使えば、似たような仕組みとして使えるかもしれないが、それらはシングルトンパターンというより単にメソッド的な形かもしれない。
GameControlスクリプトグラフでゲームオーバーを判定するためのフラグ変数としてgameOver変数を定義する。gameOver変数は複数のGraphで参照するのでScene Variablesとしてfalseで設定する。そして落下フロー(Die)の最後にgameOver変数をtrueにするようSet Variableユニットを追加する。( 3.8)
3.7 Set Active - Bird Script Graph
3.8 Set Variable - Bird Script Graph
GameControlスクリプトグラフにゲームオーバー時のリスタート処理を組み込む。gameOver変数がtrueだった場合、マウス左クリックの判定を行いtrueなら、Load SceneユニットでMainシーンをロードする。( 3.9)
Scene Build IndexはBuild Settingsに作成したSceneを追加して確認できる。( 3.10)
3.9 Restart - GameControl Script Graph
3.10 Scene Build Index - Build Settings
グラウンドとバックグラウンドをスクロールさせる
Visual Scripting Rigidbody 2D
GroundゲームオブジェクトにScript Machineコンポーネントを追加。ScrollingObjectという名前でScript Graphを作成する。さらにRigidbody 2Dコンポーネントを追加し、Body TypeをKinematicに変更する。( 3.11)
Scene VariablesとしてscrollSpeedというfloat型の変数を追加する。この変数でオブジェクトのスクロール速度を設定する。( 3.12)
3.11 ScrollingObject Script Graph - Ground GameObject
3.12 scrollSpeed - Scene Variables
ScrollingObjectスクリプトグラフをScript Graphウィンドウで表示させ、StartイベントからSet Velocityユニットを追加し、スクロール処理を組み込む。また、Birdがグラウンドに落下した場合、グラウンドのスクロールを停止する必要があるので、gameOver変数がtrueの場合にVelocityを0(ゼロ)にするようUpdate Eventをトリガーにしたフローグラフをセットする。( 3.13)
この状態だとまだグラウンドとバックグラウンドが左に完全に移動してしまうとなくなってしまう。そのため、バックグラウンドとなるGroundゲームオブジェクトを繰り返し表示させる必要がある。( 3.14)
3.13 ScrollingObject Script Graph
3.14 Need to repeat the background.
Groundゲームオブジェクトを複製してGround2ゲームオブジェクトとする。またPositionのX値をBox Colliderの幅だけ右にずらす。GroundゲームオブジェクトとGround2ゲームオブジェクトに新たにScript Machineコンポーネントを追加して、RepeatingBackgroundという名前でScript Graphを作成し追加する。
RepeatingBackgroundスクリプトグラフの説明は少々面倒なので適当に端折ってしまうが、グラウンドのBox Collider 2Dの幅を最初に取得しておいて、グラウンドのX座標の位置がグラウンドの幅よりマイナスになったら、X座標を2つの幅の分、右に戻すというのを2つのGroundゲームオブジェクトとGround2ゲームオブジェクトで繰り返すことで切れ目のない連続背景を実現する。( 3.15)
注意点としてTransform Position関連のユニットはVector2ではなくVector3扱いで処理しないとエラーになる。
3.15 RepeatingBackground - Script Graph
ここまでの進捗ビデオ③となる。プレイヤーのジャンプ・落下処理、UIの追加、背景のスクロールの実装が完成である。( 3.16)
3.16 進捗ビデオ③
次はFlappy Birdゲームの肝となる障害物を作成しスコアのカウントアップ処理を設定する。