謎の歩行生物(仮)【PART37】~ミニマップの表示と画面の仕様~

LINEで送る
Pocket

001

前回ボタン周りの仕様を一通り作りましたが、仕様がしっかり固まっていなかったので、それを固めてからもう一度作り直します。各画面(ポーズ画面とかクリア画面)にどんな情報が必要で、どこに表示されるのか、どうアニメーションさせるのか、どういう風にデータを持つのか、などしっかりと決めてから作ります。

本来複数人でゲームを作る時には、プログラマーやデザイナーが困らないよう、プランナーがしっかりと考えてから作業に入りますが、1人で作っているとその辺が疎かになってしまいますね。

 

目次

仕様

あまり細かい仕様をここで書いても仕方ないので、ざっくりとした内容だけ説明します。

①各ステージごとに残機が「3」あり、死ぬと1減る。

②各ステージにチェックポイントが最大3ヵ所あり、通過しているとリスタート時にチェックポイントから再開できる。

③残機が「0」で死ぬとリスタートできない。ただし、ゲームオーバー画面に表示される広告を見ると残機が全快する。

④ステージをクリアするか、リスタートせずに終わると残機は初期値に戻る。

⑤自分がどれだけ進んだか(チェックポイントから再開できるか、あとどれ位でクリアなのか)が分かるようにミニマップを画面右上に表示。

⑥残機を画面左上に表示。

⑦入力系のボタンは全て画面下に配置。(各画面ごとに表示されるボタンも決定。ステージセレクト画面などにも併用できるデザイン・配置に)

⑧広告は画面中央に大きく表示。

…といった感じです。ポイントは

アクションゲームが得意じゃない人も、広告を見てリトライを繰り返せばいつかクリアできる形であること。

広告を見る意味を出すためにチェックポイントから再開して少しずつでも前に進めるようにすること。

毎回死ぬたびに広告を見るのは鬱陶しいので、3回に1回の頻度で見れば良いこと(それだけ死にやすいゲームである)。

といったところからこの仕様になりました。

現在リトライを行うとシーンを再読み込みしているのですが、シーンを読み出すとそれまでの情報は全てリセットされます。つまり「何回死んだか(残機)」や「どこまでチェックポイントを通過したか」はシーンを読み出してもリセットされないようにデータを保持しておく必要があります。この辺の話は次回にしたいと思います。

 

ミニマップを表示

では、まずミニマップを表示される処理をしていきます。ミニマップを表示させること自体は難しくありません。

①現在使っているメインカメラとは別にもう1つ「Camera」を用意。(ヒエラルキービューの「Create」から作成)

②用意した「Camera」で表示させたい範囲が映るようにポジションを設定。今回の場合なら真横から見てスタートからゴールまで納まる位置に配置。

③以下の項目を設定

004

[Clear Flags]どの部分をクリアするかを設定

[Culling Mask]表示させるオブジェクトをレイヤーごとに設定。表示させたいオブジェクトにレイヤーを設定しておく必要がある。

[Projection]カメラの機能の切り替え。「Orthographic」に設定すると均等にレンダリングされる。またこの設定で下の「Size」からカメラのサイズを調整できる。

[Viewport Rect]上のX・Yでカメラで映した画面を画面上のどこに描画させるかを設定。下のW・Hでカメラの幅・高さを設定。

003

描画するオブジェクト(レイヤー)を地面とプレイヤーだけ設定した状態で、画面右上にミニマップを表示してみました。とりあえずこれでもステージ全体が分かりますが、3つほど問題が。

まずステージの構造(穴が空いてる)などの情報がネタバレしてしまっていること。このやり方だと長いステージだった場合、横に長いマップにするか、もの凄く縮小して移さなければならず、ステージによって表示のされ方が異なってしまうということ。そして最大の問題は、画面サイズが異なる端末で表示させると表示位置がずれるという点です。

これを改良して、ミニマップとして見える情報は「自分の位置」「チェックポイントの位置」であること。そしてスタートからゴールまでの表示サイズはどのステージでも固定、かつどの端末でも表示位置が同じになるようにしていきます。

 

2D(Raw Image)でミニマップ表示

というわけで、このマップをGUIとして表示させていきます。

その際にコチラのサイトを参考にさせていただきました。

http://tangerineboxgames.blogspot.jp/2016/05/unityugui.html

ミニマップに描画させたい「プレイヤー」「スタート」「ゴール」「チェックポイント」用のアイコン画像を用意して、それをステージ上の3Dオブジェクトと同じポジションに配置します。

私の場合、ゲーム実行時にアイコンと3Dオブジェクトが同じポジションになるスクリプトを用意しましたが、単純に最初から3Dのオブジェクトと同じ座標に重ねて置くだけでも問題ないと思います。

あとはアイコンのレイヤーも専用のモノを用意して適応します。ミニマップのカメラにはそのレイヤーだけを映すようにし、メインカメラの方もアイコンが映らないようCulling Maskの設定を忘れずに行います。

で、設定が終わったのでAndroid端末に出力してみると…

005

何かミニマップがグチャグチャになってるー!!

…何故? PC上(Unity上)では問題なく映っていたのに。

色々と設定をいじってみたところ、[Clear Flags]の設定で解決できました。Depth Onlyだと上記のように描画が上手くいきませんでしたが、Solid Colorに変えたところ上手くいきました。ただそれだと背景色が映ってしまうので背景のα値を0にして映らないようにしています。

001

今度こそOK!

まずはミニマップの表示が終わったので、今度は残機の表示とシーン読み込み時にデータを破棄しないよう処理を実装していきます。

 

スポンサーリンク

スポンサーリンク

LINEで送る
Pocket