ゲームではエネミーのエンカウントをはじめ、特定のタイミングである画像を表示させるといった処理が必要になる場合が多々あります。そこで今回はスクリプトを使って特定の画像を表示させる方法について説明します。
準備
イメージ
今回はエネミーとエンカウントした時、指定したエネミーを表示させる処理を想定します。実際にはエンカウントに関する確率処理等が必要になりますが、今回は簡単のため、下図のように「スライム」ボタン、「ゴブリン」ボタンおよび「ドラゴン」ボタンを用意し、ボタンを押した時にそのボタンに対応するエネミーを表示させることとします。
各オブジェクトの配置
イメージが掴めたところで、実際にボタンオブジェクトとイメージオブジェクトを配置してみましょう。詳細は省略しますが、私は以下のようにボタンとイメージを配置しました。
EnemyImage:ボタンが押された時にそれに対応する画像を表示させる
SlimeButton:スライムを表示させるためのボタン
GoblinButton:ゴブリンを表示させるためのボタン
DragonButton:ドラゴンを表示させるためのボタン
スクリプトを使って特定の画像を表示させる方法
必要な準備が整ったので、続いてスクリプトを使って特定の画像を表示させる方法について説明していきます。
STEP1:画像の用意
先ずは表示させるエネミーの画像を用意します。今回は下記サイト様の無料素材を使用させていただきます。
URL:https://pipoya.net/sozai/
使用させて頂いた素材:ポップモンスター46セット
URL:https://pipoya.net/sozai/assets/enemyillust/enemy-image/
素材がダウンロードできたら下図を参考にプロジェクトウィンドウのAssetsフォルダ直下にResourcesフォルダを作り、さらにその直下にImageフォルダを作って画像をドラッグ&ドロップします。
STEP2:画像表示処理を実装するためのスクリプト作成する
次に画像表示処理を実装するためのスクリプト作成します。今回は下図のようにButtonControllerという名前でスクリプトを作成しました。
STEP3:操作対象とするオブジェクトをスクリプトに認識させる
続いて操作対象とするオブジェクトを先ほど作成したスクリプトに認識させます。ここで言う操作対象とは今回の例ではエネミーの画像を表示するEnemyImageオブジェクトです。これによりEnemyImageオブジェクトを上で作成したスクリプトButtonControllerを使って操作できるようになります。具体的な方法は前回のUnity基礎7にてご紹介した方法を使いますので、必要に応じてご参照ください。

実際のスクリプトを示すと下記となります。
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;//Image型を扱うために導入
public class ButtonController : MonoBehaviour
{
[SerializeField] Image EnemyImage = null;//エネミー画像を表示させるImageオブジェクトとの連携のために導入
}
上記スクリプトに関しての説明は下記の通りです。
7行目:ButtonControllerクラスに、エネミー画像を表示させるImageオブジェクトを認識させるための構文。「EnemyImage」と記述した部分は任意の名前でOK。
STEP4:スクリプトをオブジェクトへアタッチする
上記STEP3で記述したスクリプトではまだ処理としては未完成ですが、説明のため、先ずは作成したスクリプトをボタンオブジェクトにアタッチします。今回のオブジェクトにアタッチするButtonControllerスクリプトは3つのボタンそれぞれがクリックされた時の操作をまとめて記述したいので、アタッチ先のオブジェクトとして空オブジェクトを作成し、その名前をButtonControllerObjectとしました。そしてこのButtonControllerObjectにButtonControllerスクリプトをアタッチします。(下図参照)
STEP5:スクリプトに操作したいオブジェクトを認識させる
STEP4でButtonControllerObjectにスクリプトをアタッチすると下図のように、インスペクターウィンドウ上でEnemyImageという箱ができます。そこにエネミー画像を表示させたいImageブジェクトをドラッグ&ドロップします。
STEP6:スクリプトを編集し、表示処理を実装する
操作対象となるオブジェクトをスクリプトが認識できたので、続いて実際に操作したい内容をスクリプトに記述します。今回は下記のような内容となります。
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;//Image型を扱うために導入
public class ButtonController : MonoBehaviour
{
[SerializeField] Image EnemyImage = null;//エネミー画像を表示させるImageオブジェクトとの連携のために導入
//「スライム」ボタンが押された時の動作。Imageオブジェクトにスライムの画像を表示させる
public void ClickSlimeButton()
{
//Assets直下のResourcesフォルダ直下にあるImage/pipo-enemy009と言うパスで表されるファイルを、変数EnemyImageと結び付けられたオブジェクトに表示させる処理。.pngなどの拡張子は不要
EnemyImage.sprite = Resources.Load<Sprite>("Image/pipo-enemy009");
}
//「ゴブリン」ボタンが押された時の動作。Imageオブジェクトにゴブリンの画像を表示させる
public void ClickGoblinButton()
{
//Assets直下のResourcesフォルダ直下にあるImage/pipo-enemy011と言うパスで表されるファイルを、変数EnemyImageと結び付けられたオブジェクトに表示させる処理。.pngなどの拡張子は不要
EnemyImage.sprite = Resources.Load<Sprite>("Image/pipo-enemy011");
}
//「ドラゴン」ボタンが押された時の動作。Imageオブジェクトにドラゴンの画像を表示させる
public void ClickDragonButton()
{
//Assets直下のResourcesフォルダ直下にあるImage/pipo-enemy021と言うパスで表されるファイルを、変数EnemyImageと結び付けられたオブジェクトに表示させる処理。.pngなどの拡張子は不要
EnemyImage.sprite = Resources.Load<Sprite>("Image/pipo-enemy021");
}
}
上記スクリプトに関しての説明は下記の通りです。ただし、4,7行目は前述と変わりありませんので、説明は省略しています。また、14行目~25行目も8行目~13行目とほぼ同様の内容ですのでそちらについても省略します。
12行目:Assets直下のResourcesフォルダ直下にあるImage/pipo-enemy009と言うパスで表されるファイルを、変数EnemyImageと結び付けられたオブジェクトに表示させる処理。.
STEP7:ボタンオブジェクトのクリック時動作を設定する
最後にボタンクリック時の動作をボタンオブジェクトに認識させます。説明の重複を避けるため、ここでは「スライム」ボタンをクリックした時の動作設定のみ説明します。設定を行うには具体的には下図のように「スライム」ボタンオブジェクトのOnClick()に先に実装したClickSlimeButtonメソッドを設定します。他のボタンについても同様です。
機能テスト
ここまでできたらPlayボタンを押してゲームを起動させ、処理が想定どおりに行われているか確認しましょう。実際に起動させてみた結果、下図のようにクリックしたボタンに応じてImageオブジェクトに表示されるエネミーの画像が変更されました。
今回はスクリプトを使って特定の画像を表示させる方法について説明しましたがいかがだったでしょうか。今回は押されたボタンに応じて表示させる画像を変更させる処理でしたが、エンカウント処理結果に応じたエネミーを表示させたり、選択されたマップの画像を表示させたりとゲーム制作では様々な場面で利用できる内容だと思います。ぜひ皆さんのゲーム制作でも参考にしていただければと思います。
以上。
コメント