Chapter21 女神を降臨させるプログラム
今回もゲームエンジン『Unity』を使った『新婚三択ADVゲーム』制作の続きをやっていこう。
↓↓↓最初から見たいという方はこちらからどうぞ。↓↓↓
さて今回だが、タイトルにもあるように女神を降臨させてみようと思う。
用意するのは、『女神』と『女神が降臨するに相応しい背景』
昨日作った『女神』、『風呂の背景』、『風呂の背景(浴槽から下のみ)』があるので今回はこれらを使っていく。
それでは例のごとく『Unity』を立ち上げよう。
前回までは主に玄関のシーンを編集してきたが、今回は三択の一つ『お風呂』のシーンを編集していく。
以前、Sceneフォルダーの中に『お風呂』を選んだ場合に表示される『SecondScene』というSceneを作成して、『「お風呂」ボタン』と『SecondScene』をリンク付けるというところまではやっている。
ちなみにその時の記事がこちら↓↓↓
『SecondScene』をダブルクリックすると、このようにお風呂シーンの編集画面に切り替わる。
まずは例のごとく『Assetsフォルダー』内に絵素材を追加し、適当なサイズで画面上に『女神』を置いてみる。
『OrderInLayer』の数字を背景画像より高く設定すれば、『女神』が『風呂の背景』より手前に表示される。
次が少しシビアな作業になるが、『風呂の背景(浴槽から下のみ)』を追加して、『OrderInLayer』を『女神』より高い設定にして手前に配置。もともとの背景との境がばれないように微調整をする。
これで、とりあえず最初の画面設定は完了だ。
それではスクリプトを作っていこう。
スクリプトの名前は勝手に『Advent』と名付けた。
今回のイメージとしては、
・スタートして直ぐに『女神』のY座標を浴槽より低くし、透明度をマックスまで上げる。
・画面がタップされたら、Y座標徐々に高くして、それに合わせて透明度も下げていく。
といった感じだ。
スクリプトを開いたら、最初に必要なフィールドをいくつか宣言していく。
まずは『SerializeFielde』を頭に付けて『float型(少数の値を格納できる)』の変数『speed』を用意する。
『SerializeFielde』を頭に付けた変数は、このように『Inspector』の項目から値の変更が可能になる。
このフィールドの用途は、ざっくり言うと『女神』のフェードインにかかる時間の設定である。
続いて宣言しているこの3行だが、『x==女神のx座標』、『y==女神のy座標』、『a==女神の不透明度』を格納するために用意した。
次に宣言しているのは『SpriteRenderer型』のフィールドで『Visualization』と名付けている。
ちなみに『SpriteRenderer型』というのはこちらの『Unity』で用意されている『Sprite Renderer』という項目の情報を格納することが出来る型である。
最後に宣言しているのは『int(整数)型』の『tap』というフィールドで、初期値は『0』にしてある。
このフィールドは画面がタップされたかどうかの判定用に用意した。
フィールドの宣言が完了したので、次はプログラムが開始された後の処理を書いていこう。
まず、プログラムが開始されたタイミングで一回だけ読まれる『Start関数』の中にはオブジェクトの初期情報について書いていく。
『this.gameObject.transform.position= new Vector2( x, y )』では何をやっているかというと、
『このスクリプトが付与されている.ゲームオブジェクトの.[Transform]項目にある.[position]フィールドを=新しく作った[Vector2型]のフィールド(x座標,y座標)で上書きする』ということをやっている。
要するにここの『x座標』、『y座標』に、最初に宣言した『x==女神のx座標』と『y==女神のy座標』を代入しているということになる。
次にこの部分では、先ほど『SpriteRenderer型』で宣言した『Visualization』フィールドと、ゲームオブジェクトが元から持っている『SpriteRenderer』フィールドとをリンクさせて、『Visualization』フィールドからオブジェクトの表示設定を変えられるようにしている。
例えばこの部分では<SpriteRenderer>の情報と紐づいている『Visualization』フィールドの『color』設定に、『Color型』のフィールド(255,255,255,a)を新しく作って代入するということをやっている。
(255,255,255,a)とはこの色の設定のことで、左から順に『red』、『green』、『blue』、『alpha(不透明度)』の値を設定している。
ちなみに今回、『alpha』に代入した『a』というのは、冒頭に宣言した『float a=0f』のことで、初期値は『0』、つまり完全に透明な状態を差す。
以上が女神の初期設定であり、この状態でプログラムを実行すると・・・
このように、女神は浴槽の下へ移動し、完全に透明な状態になるため、全くどこにいるかが分からないようになる。
あとはスマホの画面がタッチされた場合に、徐々に『y座標』が増え、徐々に不透明になっていくというプログラムを一秒間に約60回更新される『Update関数』内に書いていけばいい。
『もしも画面がタップされたら、初期値[0]だった[tap]フィールドに[1]を代入し』
『もしも[tap]フィールドの値が[0]より大きければ、オブジェクトの[y座標]と[不透明度]をそれぞれの[if条件が満たされなくなるまで]少しずつ繰り返し増やす』
こうすることによって『浴槽の中からじんわりと女神が降臨する』というようなアニメーションを作り出すことが出来る。
こちらテスト動画でございます。
ご閲覧ありがとうございました。
この記事が気に入ったらサポートをしてみませんか?