【Unity】ランダムな画像を表示する方法! 関数として取り出せるコピペ可能なコード付き

【Unity】ランダムな画像を表示する方法! 関数として取り出せるコピペ可能なコード付き

 ボタンを押すだけで画像をランダムで表示する方法について詳しく解説していきます。実際の操作手順を画像付きで解説していますのでこの記事を最後まで読めば必ず実装できるかと思います。不明な点等がありましたら気軽にコメントして頂ければ可能な範囲で対応しますね。

今回作るもの

ボタンを押すとランダムに画像を変化させる

前準備

表示したい画像を用意※超重要

 最初に注意しておきたいことがあります。

 Resourcesフォルダを作り、そこに画像を入れましょう。

 画像ではResourcesフォルダ内にimgファルダを作り、そこに画像を入れています。

 後述しますが、スクリプトからこのResourcesフォルダ内を読み込むため、別の場所に適当に入れておくと実装できません。

 1~画像の個数分だけ読み込むので、途中で欠けている番号がないか確認してくださいね。

 今回は当ブログのサムネイル画像を使用します。

Raw画像を作成

 これでメインとなる表示用の画像オブジェクトが完成しました。

 次にコーポメントのRawImageから最初に表示しておきたいテクスチャを選択しましょう。

ボタンを作成

 Raw画像同様にボタンを作成します。

 特に難しいことは無いので割愛しますね。

GameManagerを作成

 空のオブジェクトを作り、名前をGameManagerとします。

 この空のオブジェクトにスクリプトを張り付けて実行します。

スクリプトを1つだけ作成

 画面下のAssetなどのファイルがある場所で右クリックを押します。

 作成→C#でスクリプトを作成し、名前を”GM”にします。このスクリプトをGameManagerに張り付けておきましょう。

実装手順

 しっかりと理解したい方向けに1つ1つ解説していきます。

 お急ぎの方は一番最後のまとめに全てのコードがありますのでさっそくコピペして使ってください。

表示する画像のRaw画像コンポーネントを取得する

 スクリプトは以下の通りです。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using Random = UnityEngine.Random;

public class GM : MonoBehaviour
{
    //表示させる画像オブジェクトのRaw画像コンポーネント
    public RawImage img;

    // Start is called before the first frame update
    void Start()
    {
       img = GameObject.Find("DisplayImage").GetComponent<RawImage>();
    }
}

おまけ

 筆者自体がど忘れすることがあるのでおまけとしておさらいしておきます。

ゲームオブジェクトを取得する方法

 (階層の名前/ゲームオブジェクトの名前)でも探すことができる。

GameObject.Find()全てのゲームオブジェクトから該当する名前のオブジェクトを探す。オブジェクトが多いと動作が遅いので最初のロードだけで使われることが多い。
GameObject.transform.Find()指定したゲームオブジェクトの子オブジェクトから探す。動作が軽い。親となるゲームオブジェクトが必要

コンポーネントを取得する方法

 Unityのマニュアルからコンポーネントの型を調べる。

 コンポーネントの型 名前 = GameObject.GetComponent<コンポーネントの型>();

リソースから画像を読み込む

 読み込む部分だけ関数化しました。

 表示させる画像リストの定義だけ忘れないようにしましょう。

//省略

    //表示させる画像リスト
    public List<Texture> texture_list = new List<Texture>();

    // Start is called before the first frame update
    void Start()
    {
       //省略

        //1~10の画像を読み込む
        read_img(10);
    }

    //リソースから表示させたい画像を指定した個数だけ読み込む関数
    public void read_img(int n)
    {
        Texture tmp;
        for(int i=1; i<n+1; i++)
        {
            tmp = Resources.Load("img/" + i) as Texture;
            texture_list.Add(tmp);
        }
    }

 前準備を終えている方であれば、Recourse/imgフォルダ内に画像が入っているかと思います。

 最後の画像の番号をread_img()の引数に指定してあげれば、しっかりと読みこんでリストに格納してくれます。

 アプリが起動した最初に行う必要があるので必ずStart()内で使ってください。

おまけ:よく使うList<T> listの操作

list.Add(T)リストの最後尾に追加してくれる
list.Countリスト内の要素数を返してくれる

ランダムで表示させる関数を作成

 ここが今回のメインです。

 筆者の環境では、Ramdomが他にもあるらしく、usingで今回使用するのはUnityEngineのRandomですと指定しています。

 変更点はボタンで呼び出される関数のところですね。

//省略
using Random = UnityEngine.Random;

public class GM : MonoBehaviour
{
    //省略

    //ボタンで呼び出される関数
    public void ChangeImage()
    {
        //1~表示する画像の数をランダムで算出
        int random = Random.Range(1, texture_list.Count);

        Debug.Log("ランダム値は" + random);

        img.texture = texture_list[random];
    }
}

 これで画像の数だけランダムな数字を返し、それに対応する画像をリストから選出します。

 後は最初に取得したRaw画像のimgのテクスチャを書き換えるだけです。

ボタンを押したときに関数を呼び出す

 Buttonコンポーネントの+をクリックします。

 GameManagerをドラッグ&ドロップし、GMスクリプトの関数を選びます。

 すると、ボタンを押したときにGMスクリプト内の関数が呼び出されるようになります。

まとめ&コピペ化なソースコード

 これで完成しましたね!

 実装手順をまとめると以下のようになります。

  • 表示したい画像をRecourseフォルダ内に用意
  • 画像の名前を1から順に番号を振っていく
  • Raw画像・ボタン・空のオブジェクトとスクリプトを用意
  • スクリプトにソースコードを張り付ける

ソースコード

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using Random = UnityEngine.Random;

public class GM : MonoBehaviour
{
    //表示させる画像オブジェクトのRaw画像コンポーネント
    public RawImage img;

    //表示させる画像リスト
    public List<Texture> texture_list = new List<Texture>();

    // Start is called before the first frame update
    void Start()
    {
       img = GameObject.Find("DisplayImage").GetComponent<RawImage>();
        //1~10の画像を読み込む
        read_img(10);
    }

    //リソースから表示させたい画像を指定した個数だけ読み込む関数
    public void read_img(int n)
    {
        Texture tmp;
        for(int i=1; i<n+1; i++)
        {
            tmp = Resources.Load("img/" + i) as Texture;
            texture_list.Add(tmp);
        }
    }

    //ボタンで呼び出される関数
    public void ChangeImage()
    {
        //1~表示する画像の数をランダムで算出
        int random = Random.Range(1, texture_list.Count);

        Debug.Log("ランダム値は" + random);

        img.texture = texture_list[random];
    }
}