はじめに
今回は車を旗の前ギリギリで止めるいわゆる「チキンレース」を作ってみようと思います。参考・およびアセット素材は前回同様にSBクリエイティブさんの「はじめてでも安心！Unityの教科書2019年度版」のサポートページからダウンロードした素材を使用しています。
準備
新規作成もしくはNew Projectから、プロジェクトを開きます。
今回使用する素材をプロジェクトウィンドウにドラック＆ドロップしておきます。
続けてアセットの配置をしていきます。インスペクターウィンドウからpositionの数値を入力していきます。
車を「-7,-3.7,0]、旗を「7.5,-3.5,0」と座標を指定します。
地面は座標を「0,-5,0」、加えてスケールも「18,1,1」と指定していきます。
前回でゲームの実行背景画面が青色となっていたので、変更していきます。カメラオブジェクトをクリック→インスペクターウィンドウよりカメラのBackgroundの色を適当なカラーに変えましょう。
これでゲームの実行をしてみましょう。
……あれ、画面が切れてますね。これはデフォルトだとカメラのサイズがあっていないため起こったことでしょう。カメラのインスペクターウィンドウからSizeを5.5に変更してみましょう。
上手くいきましたね。これで準備は完了です。
スクリプトのアタッチ
次は車を動かすためのスクリプトを作成します。
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class Car : MonoBehaviour
{
float speed = 0;
Vector2 startPos;
void Start()
{
}
void Update()
{
// スワイプの長さを求める
if (Input.GetMouseButtonDown(0))
{
// マウスをクリックした座標
this.startPos = Input.mousePosition;
}
else if (Input.GetMouseButtonUp(0))
{
// マウスを離した座標
Vector2 endPos = Input.mousePosition;
float swipeLength = endPos.x - this.startPos.x;
// スワイプの長さを初速度に変換する
this.speed = swipeLength / 500.0f;
}
transform.Translate(this.speed, 0, 0); // 移動
this.speed *= 0.98f; // 減速
}
}
前回のルーレットのプログラムと似ているところがありますね。
操作内容としては「マウスをクリックする」、「速度を変化させる」、「スピードを減速させる」ところが同様の挙動をしています。
今回はマウスのクリックした座標を基準として、離した座標を引くことでベクトルの大きさを初速度と置き換え変数speedを変化させて車を動かすという仕様が追加されたプログラムです。
初速度に関してはスワイプした際の座標の数値を鑑みて500で割っていますが、これは数値を変えると初速度を変化させることができます。
ではこのプログラムを前回同様プロジェクトウィンドウのCarにアタッチしましょう。
これでスクリプトは完了です。
#UIの設定をする
スクリプトのみでもゲームは作成できていますが、これでは旗までの距離がよくわかっていませんよね。
これで表示したいのでUIとして旗までの距離を設定していきましょう。
ヒエラルキーウィンドウからCreate→UI→Textから距離に関するUIを作成します。
画像のように位置やフォントサイズを変更していきます。このままゲームの実行をするとテキスト内容の中身「Next Text」が表示されるため、このテキストにスクリプトをアタッチしていきましょう。
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI; // UI部品を使うために必要！
public class DistanceUI : MonoBehaviour
{
GameObject car;
GameObject flag;
GameObject distance;
void Start()
{
this.car = GameObject.Find("car");
this.flag = GameObject.Find("flag");
this.distance = GameObject.Find("Distance");
}
void Update()
{
float length = this.flag.transform.position.x - this.car.transform.position.x;
this.distance.GetComponent<Text>().text = "ゴールまで" + length.ToString("F2") + "m";
}
}
流れとしてはまずゲームのオブジェクトをFindメソッドよりアセットをUIに認識させて参照します。そして常に旗と車の距離(x座標)を更新し、その数値をCanvasのテキストとして表示させる…というものです。
このスクリプトをヒエラルキーウィンドウからCreate→Create Emptyより空のオブジェクトを作成しこのアタッチしましょう。この空のオブジェクトはこのゲームの監督的な役割を果たしており、UIの更新の役割を負っています。
それではゲームの実行を行い、完成したものを見てみましょう。
上手くできましたね。これで終了です。
P.S. 監督オブジェクトを作成しても良いですが、CanvasのDistanceに直接DistanceUIをアタッチさせても上手くいきました。違いは何なのでしょうか…