見出し画像

#3【備忘録】無人島ステージを作って、ミニマップを実装する【無謀にも3D東方二次創作ゲーム作成】

<前回の記事>

前回までで、キャラクターを動かすことはできたので、今度はステージを作っていきます。

1.無人島を作る

以下の記事を参考に無人島を作成します。

記事中で使用している「Water Shaders V2.x」ですが、AssetStore上でHDRP, URPでは動かないと釘を刺されているので、以下のURP対応の水面の無料Assetに変更しました。

設置位置は以下のとおりです。

記事と同じくScene2の島を使用。

RockPackegeについてはBuilt-inからURPの変換に成功しましたので、使用します。

ビルトインからURPへの変更方法は以下の記事を参考にしてください。

使いこなせないのにSmartBuilderというアセットを導入したので、それを使用して岩を並べます。

Prefabが増えたら便利そう

岩を設置したら、メッシュコライダーを適用します。適用しないと以下のようになります。

いしのなかにいる

2.Skyboxを設定する

次はSkyboxを設定します。ざっくり言うと背景ですね。
今回の無人島のアセットには既に設定されていましたが、勉強のためにも自分でやってみます。といっても、以下の記事のとおりにやるだけです。

元々設定されていたSkybox。ぷはー 今日もいい天気☆
夜の海
ファンタジー風
アニメ風。もうゴールしそう。

Skyboxが220個も入っているAllSkyも購入したので、色々試してみました。

3.ミニマップを実装する

次はミニマップを実装していきます。
以下の記事によると、「MiniMapCamera」Prefabをヒエラルキーにぶち込めばいいだけみたいですが…

何も映らない…

しかし、prefabのTransformとMiniCameraScriptを見てわかりましたが、prefabのy座標がターゲットより低く、地面の中に潜り込んでいます。

//元のminiCameraScript

using UnityEngine;
using System.Collections;

public class miniCameraScript : MonoBehaviour {
	public Transform MiniMapTarget;
	void Update(){

	}
	void LateUpdate () {
		transform.position = new Vector3 (MiniMapTarget.position.x,transform.position.y,MiniMapTarget.position.z);
		transform.eulerAngles = new Vector3( transform.eulerAngles.x, MiniMapTarget.eulerAngles.y, transform.eulerAngles.z );
	}
}
//修正したminiCameraScript
using UnityEngine;

public class miniCameraScript : MonoBehaviour {
	public Transform MiniMapTarget;//ターゲット
	public bool canRotate;//回転を許可するか
	public float flyPosition;//ターゲットとどれくらい距離をとるか

	void LateUpdate () {
		transform.position = new Vector3 (MiniMapTarget.position.x,MiniMapTarget.position.y+flyPosition,MiniMapTarget.position.z);
		if (canRotate) {
			transform.eulerAngles = new Vector3(transform.eulerAngles.x, MiniMapTarget.eulerAngles.y, transform.eulerAngles.z);
		}
	}
}

上記の通りprefabのy座標はMiniMapTarget.position.y+flyPositionでtargetとなるオブジェクトのy座標からflyPosition分高くし、さらにbool値のcanRotateを実装することで、マップの回転を有無を設定できるようにしました。

周りの岩もちゃんと映ってます

更にミニマップ上で方角が分かるようにして、ミニマップ上のプレイヤーも矢印に変更することで、今自分がどこに向かっているのか明確にします。

まずProBuilderで等辺が長い二等辺三角形の立体「Arrow」を作り、PlayerArmatureの子オブジェクトにし、y座標を∔5にします。
そしてレイヤー「Minimap」を作成し、Arrowに設定します。

PlayerArmatureから座標∔5

そして、以下の記事を参考にカメラのカリング設定を行います。
これでメインカメラにはArrowは映らず、ミニマップ用カメラにだけ映すことができます。

次に方角が分かるようにします。

コンパス用画像(自由に使ってください)

分かりにくいですが、上の画像は白いリング状になっており、中は透過されています。このような画像を用意します。
そして、MiniMapCameraの子オブジェクトとして、UI>画像を作成します。
階層としてはMiniMapCamera>Canvas>imageとなるので、imageのimageコンポーネントのソース用画像として先ほど用意した画像を使います。
imageのRectTransformの数値は画像を参考にしてください。

CanvasはCompassにリネームしています

そしてScript「Compass」をCanvasに追加してください。Scriptは以下の記事を参考にしています。

using UnityEngine;
using UnityEngine.UI;

public class Compass : SerializedMonoBehaviour {
    [SerializeField] Image image;
    [SerializeField] Transform player;
    [SerializeField] float angleOfflet = 0f;
    [Header("方角、0はVector3.forwardが北。90でVector.forward.rightが北。")]public float direction;

    RectTransform imageRect;//コンパスの画像を指定
    Quaternion q;
    Quaternion offset;

    void Start() {
        imageRect = image.rectTransform;
        offset = Quaternion.AngleAxis(angleOfflet, Vector3.up);
    }

    void Update() {
        q = player.rotation * offset;
        q.z = q.y;
        q.y = 0f;
        imageRect.rotation = Quaternion.Euler(90,q.z-direction,0f);
    }
}

Quaternionは複雑であまり理解できてないのですが、とりあえず動いたのでよしとします。

霊夢さん駆け回る

次回は、今回少し使ったProBuilderを学んでいきたいと思います。

<次回の記事>

<Quaternionの参考記事>

この記事が気に入ったらサポートをしてみませんか?