とりあえず3行で
- Unity 2Dで
- Scriptを駆使して
- ゲーム実行中に複数枚の画像を切り替える
動画確認バージョン
以下のUnityで動作確認済み
- 2018.3.7f1
- 2019.1.3
手順
そんなに大変じゃない．
手順 1 プロジェクトの新規作成
2Dのプロジェクトを新規作成
手順 2 準備
手順2-1から2-3は順不同．
手順2-1 画像ファイルの準備
ゲーム実行中に表示したい画像ファイルをAssets/Resources下のフォルダ内に保存する．
- 今回はAssets > Resources > Texturesというフォルダにleft01.jpg, ..., left14.jpgというファイルを保存した (下図参照)
- 保存するフォルダはProject > Assets > Resources以下のフォルダなら何でも良い
- Assets内にResourcesフォルダが存在しなければ作成する
- 後述するスクリプトのパスの設定次第では全く違うフォルダに保存しても大丈夫かもしれない (未検証)
手順2-2 画像表示用オブジェクトの準備
画像表示用オブジェクトSpriteをシーンに追加する．
- GameObject > 2D Object > Sprite で追加
- Sprite追加後のHierarchyは下図のようになる
手順2-3 画像検索＋表示用スクリプトの準備
画像検索＋表示用スクリプトを用意する．
- Assets直下にC#のScriptを新規作成 (Assetsを右クリック > Create > C# Script)
- 名前はデフォルト(NewBehaviourScript)のまま
- スクリプト追加後のAssetsは下図のようになる
手順3 スクリプトの更新
手順2-3で作成したスクリプトの内容を下記の内容に更新する．
- classの中身だけ変更すればOK
- 手順2-1で画像を保存したフォルダ名がTexturesでない場合は，const string DIR_IMAGES = "フォルダ名";の部分を修正
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class NewBehaviourScript : MonoBehaviour
{
public int m_index = 0;
public int numImages;
const string DIR_IMAGES = "Textures";
SpriteRenderer m_SpriteRenderer;
public Sprite m_Sprite;
public Sprite [] m_Sprites;
// Start is called before the first frame update
void Start()
{
// Retrieve all images in DIR_IMAGES
m_Sprites = Resources.LoadAll<Sprite>(DIR_IMAGES);
numImages = m_Sprites.Length;
Debug.Log("#images: " + m_Sprites.Length);
m_SpriteRenderer = gameObject.GetComponent<SpriteRenderer>();
m_SpriteRenderer.sprite = m_Sprites[m_index];
}
// Update is called once per frame
void Update()
{
float motion = Input.GetAxis("Mouse ScrollWheel");
if (motion != 0f )
{
if (motion > 0f ) // forward
{
m_index = (m_index+1) % numImages;
Debug.Log("m_index: " + m_index);
}
else if (motion < 0f ) // backwards
{
--m_index;
if(m_index < 0)
{
m_index = numImages-1;
}
Debug.Log("m_index: " + m_index);
}
m_SpriteRenderer.sprite = m_Sprites[m_index];
}
}
}
手順4 スクリプトをSpriteに紐づけ
手順3で更新したスクリプトを，手順2-2で作成したSpriteに紐づけする．
- HierarchyウィンドウのNew Spriteをクリックしてアクティブにする
- (画面左側の)Projectウィンドウのスクリプトを(画面右側の)Inspectorウィンドウにドラッグ＆ドロップする
手順5 実行
実行する．
- マウスホイールをグリグリスクロールすると表示される画像が変わる．
- グリグリし過ぎると，最初の画像に戻る．
気になる点とか
読み込む画像
- Resources.LoadAll関数を使って，スクリプト内で指定したDIR_IMAGESの画像を読み込んでいる
- サブフォルダ内の画像も全て読み込むようになっているのがちょっと不便
