それでは手順1で作成した Main シーンに、背景用のゲームオブジェクトを設置してゲーム画面の背景を作成します。
Project 内の Asstes/Sunnyland/arkwork/Environment/ を選択して、フォルダ内にある back ファイルを選択してください。
Asstes/Sunnyland/arkwork/Environment/back
このファイルをヒエラルキー、あるいは Scene ビューのいずれかにドラッグアンドドロップします。
自動的に back ゲームオブジェクトが1つ作成されます。この画像をゲームの背景画像として利用します。
ヒエラルキー画像
SceneビューとGameビューの画像
作成された back ゲームオブジェクトですが、Gameビューで見ると、画面に見える大きさよりも小さい状態です。
これは Transform コンポーネントの Scale が (1, 1, 1) の大きさでゲームオブジェクトして作成されたためです。
back ゲームオブジェクトを選択して、インスペクターを確認し、Transform コンポーネントの内容を下記の画像のように設定してください。
Gameビューで見た際に、画面一杯に back の画像が表示されるようにすることが目的です。
back ゲームオブジェクト インスペクター画像
大きさを調整後は、SpriteRenderer コンポーネントを確認し、Order in Layer の値を 0 => -1 に変更してください。
2Dゲームでは画像同士が重なって表示された場合、3Dとは異なり、画像の持つ優先順位によって、画面の前面に表示されるか、隠れてしまうかが決定されます。
この Order in Layer の値が優先順位であり、値が低い画像ほど優先順位が低く、後面になります。背景の画像ですので、最も後面に表示をさせたいため、この値を低く設定しています。
これでゲームの背景画像が設置できました。一度、セーブを行いましょう。ctrl + S キーでセーブが行えます。
特に記載がなくても、こまめにセーブを行うことを心がけてください。
この背景画像を右側から左側に向けてスクロールさせる処理をこの後、行います。
ですが、この back ゲームオブジェクトが左に向かって動いていってしまうと、下記の動画のように、ゲーム画面から背景がなくなってしまいます。
<検証動画>
https://gyazo.com/a1fbbf86fb69e6981e97e0497f642d99
そこでもう1つ、同じ背景の画像を用意します。
ヒエラルキーの back ゲームオブジェクトを選択して右クリックをするとメニューを表示されますので、Duplicate(複製)を実行してください。
back ゲームオブジェクトの複製である back(1)ゲームオブジェクトが新しくヒエラルキーに追加されます。
ヒエラルキー画像
複製されたゲームオブジェクトは、複製元のゲームオブジェクトと同じ位置にありますので、画面の右側に移動させて2枚の画像が上手く重なる位置に設置をします。
下記のインスペクター画像の Transform コンポーネントの値を参考にしてください。
Sceneビューの画像(Sceneビューの画面向かって左側が back、右側が back(1)です)
back(1) ゲームオブジェクト インスペクター画像
これで背景画像の設定は完了です。
ゲームオブジェクトの名前はこのままでもよいですし、BackGround_left、BackGround_Right のように変更しても構いません。
手順書では back ゲームオブジェクトと、back(1)ゲームオブジェクトのままにしていますので、名前を変更した場合には適宜に読み替えてください。