Objectに当たったらImageを表示させよう！宝探しゲーム？？

---
title: Objectに当たったらImageを表示させよう！宝探しゲーム？？
tags: C# Unity
author: irishbeer

---

#はじめに
受講生に送ろうと思ったんですけど、これを説明するのは大変だと思って、記事にしました！3Dの宝探しゲームとかで、使えそうな機能があると思うので、ぜひ使ってみてください！！



#目次

&emsp;&emsp;[1.&emsp;完成予想図](https://qiita.com/irishbeer/private/044020652f94e59bd479#%E5%AE%8C%E6%88%90%E4%BA%88%E6%83%B3%E5%9B%B3)
&emsp;&emsp;[2.&emsp;変数共有(getterとsetter)](https://qiita.com/irishbeer/private/044020652f94e59bd479#%E5%A4%89%E6%95%B0%E5%85%B1%E6%9C%89getter%E3%81%A8setter)
&emsp;&emsp;[3.&emsp;enabledとは](https://qiita.com/irishbeer/private/044020652f94e59bd479#enabled%E3%81%A8%E3%81%AF)
&emsp;&emsp;[4.&emsp;素材の準備](https://qiita.com/irishbeer/private/044020652f94e59bd479#%E7%B4%A0%E6%9D%90%E3%81%AE%E6%BA%96%E5%82%99)
&emsp;&emsp;[5.&emsp;いざ、開発！！](https://qiita.com/irishbeer/private/044020652f94e59bd479#%E3%81%84%E3%81%96%E9%96%8B%E7%99%BA)
&emsp;&emsp;[6.&emsp;コード全容](https://qiita.com/irishbeer/private/044020652f94e59bd479#%E3%82%B3%E3%83%BC%E3%83%89%E5%85%A8%E5%AE%B9)<br>




#完成予想図
宝物(今回は、cubeを色つけ)を取ったら、imageを表示させました〜！！
![Aug-25-2021 23-37-29.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/a8e52d00-09f8-c2bd-e710-06d679bd09f5.gif)



#変数共有(getterとsetter)
変数の共有といえば、調べたらいっぱい出てきそうですが、今回はgetterとsetterを扱います！簡単にいうと、値を取得(get)して、値を代入(set)することです！！しばしば、setはprivateをつけて使用されることが多いです！理由としては、別のインスタンス(複製された別のオブジェクト)から値を代入できぬようにしています！
まあ、こうゆうのは後から覚えた方が理解の助けになる気がします笑詳しく知りたい方は、[こちら](https://docs.microsoft.com/ja-jp/dotnet/csharp/properties)どうぞ！！

後で、出てくると思いますが、先に説明しちゃいます！

```C#:gameManageScript
//変数宣言

    //他からアクセスするために、publicをつける。これがプロパティ
    public GameObject Painting1instantiated
    {
        //取得したオブジェクトを参照
        get { return painting1instantiated; }
        //他のスクリプトから得た値(ここでは、オブジェクト)を代入
        private set { painting1instantiated = value; }
    }

```

#enabledとは
しばしばSetActiveと対比され、何かを表示/非表示にしたい時、enabledかSetActiveかで迷う時があります。結論からいうと、SetActive(false)は親も子もgameObjectが無効になるのに対し、enabledはgameObjectにアタッチされているコンポネントが無効になる。
僕は、Image(UI)を非表示にしたかったので、SetActiveではなく、enabledを使いました。

形としては、こんな感じです！

```C#:playerScript
    painting1Point.enabled = false;
    painting1Point.enabled = true;
```



#素材の準備
適当な画像を四枚用意し、Unityにインポート。(僕はいらすとやから宝物っぽいものを取ってきました)
![スクリーンショット 2021-08-26 10.43.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/786f9efb-7045-0c0e-8c57-271e6008ea5f.png)


#オブジェクトの準備
playerと宝物の高さの調整をしやすいように、plane(地面)を置きます。
![スクリーンショット 2021-08-26 10.51.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/db5759ca-7e95-a3a6-a17a-31825cdf2031.png)

#いざ、開発！！
長い長い説明と準備はとりあえず終わり！ここから、じゃんじゃん作っていきましょう！

##1. playerの移動実装
ここは、説明や解説は省略させていただきます。
ⅰ. Herarchyからcubeを選択して、[Rename]で、playerと変更。
ⅱ. projectからmaterialを作り、今回は紫色にして、playerにドラッグ&ドロップ
ⅲ. スクリプトを作って、名前を**playerScript**下記のコードをコピペしてください。

```C#:playerScript
    
    //変数宣言
    float speed = 5.0f;


    //~~省略~~

    void Update()
    {
        if (Input.GetKey("up") == true)
        {
            this.transform.position += new Vector3(0, 0, speed * Time.deltaTime);
        }
        if (Input.GetKey("down") == true)
        {
            this.transform.position -= new Vector3(0, 0, speed * Time.deltaTime);
        }
        if (Input.GetKey("right") == true)
        {
            this.transform.position -= new Vector3(speed * Time.deltaTime, 0, 0);
        }
        if (Input.GetKey("left") == true)
        {
            this.transform.position += new Vector3(speed * Time.deltaTime, 0, 0);
        }

    }


```

ここまで、こんな感じになってればOK!!
![スクリーンショット 2021-08-26 11.11.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/e173535b-7181-624a-c6ef-3457d4d9b999.png)


##2. 宝物をランダムで生成しよう！！

###2-1. 準備
ⅰ. このゲームを管理する空のGameObjectを作り、**GameManager**としておく。
ⅱ. cubeとして、生成するオブジェクト(宝物)を作り、prefab化しておく。これは全部で四つ作り、それぞれ名前と色を変えておく。僕は宝物のAssetを準備するのがめんどくさかったので、cubeを色つけしました。笑
ⅲ. ここまで
![スクリーンショット 2021-08-26 11.31.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/65be8ea5-45af-70a9-e919-2da622cdc135.png)
ⅳ. 最後に生成される場所を作りましょう。これは、hierarchyから空のオブジェクトを3つ用意して、それぞれを**p1**、**p2**、**p3**と名前をつけておく。

###2-2. gameManageのコードを書いていこう！！

```C#:gameManageScript
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class gameManageScript : MonoBehaviour
{
    //後ほど生成する時に、何を生成すべきかわからないため、publicをつけておく。
    public GameObject painting1;
    public GameObject painting2;
    public GameObject vase;
    public GameObject gem;

    //ⅰで解説
    public Transform p1;
    public Transform p2;
    public Transform p3;

    //ⅲで解説
    GameObject painting1instantiated;
    GameObject painting2instantiated;
    GameObject vaseinstantiated;
    GameObject geminstantiated;

    //これは、上の"変数共有(getterとsetter)"の通り。
    public GameObject Painting1instantiated
    {
        get { return painting1instantiated; }
        private set { painting1instantiated = value; }
    }
    public GameObject Painting2instantiated
    {
        get { return painting2instantiated; }
        private set { painting2instantiated = value; }
    }
    public GameObject Vaseinstantiated
    {
        get { return vaseinstantiated; }
        private set { vaseinstantiated = value; }
    }
    public GameObject Geminstantiated
    {
        get { return geminstantiated; }
        private set { geminstantiated = value; }
    }

    void Start()
    {

        //配列。宣言した宝物(gameObject)を一つの箱に格納。
        GameObject[] treasures =
        {
            painting1,
            painting2,
            vase,
            gem
        };

        //上と同じ
        Transform[] places =
        {
            p1,
            p2,
            p3
        };

        //生成される場所をfor文でLoopさせている。
        for (int i = 0; i < 3; i++)
        {

            //Random.Rangeでランダムで箱から取り出し、それが"treasures[0]だったら"という文
            if (treasures[Random.Range(0, 4)] == treasures[0])
            {
                //ⅱで解説
                painting1instantiated = Instantiate(treasures[0], places[i]) as GameObject;
            }else if (treasures[Random.Range(1, 4)] == treasures[1])
            {
                painting2instantiated = Instantiate(treasures[1], places[i]) as GameObject;
            }else if (treasures[Random.Range(2, 4)] == treasures[2])
            {
                vaseinstantiated = Instantiate(treasures[2], places[i]) as GameObject;
            }else if (treasures[Random.Range(3, 4)] == treasures[3])
            {
                geminstantiated = Instantiate(treasures[3], places[i]) as GameObject;
            }
        }


    }



}


```

ⅰ. Transformは座標を取得するための型。後ほど出てくる、[Instantiate]の**どこに**の部分で、GameObjectで変数宣言してしまうと、型が違うと出てしまうので、Transformで変数宣言。もっと詳しく知りたい方は[公式ドキュメント](https://docs.unity3d.com/jp/current/ScriptReference/Transform.html)を！！

ⅱ. これから、Playerが宝物にぶつかった時、その宝物を消したい(獲得したい)が、宝物自体を消してしまうと、[Null reference]というスクリプトで命令しているけど、Unity上でその物体がないよというエラーが出てしまう。なので、生成されたオブジェクトを消したいので、[~ as GameObject]という書き方になっている。

ⅲ. また、その生成されたオブジェクトを**playerScript**で、当たったら消す(獲得したい)ので、ローカル変数宣言ではなく、グローバル変数宣言をして、変数共有ができるようにしている。ローカル変数は、**メソッド内で定義された変数**で、そのメソッド内でしか使うことができない。
**例**

```C#
void Start(){
    //この形がローカル変数
    GameObject painting1instantiated = Instantiate(treasures[0], places[i]) as GameObject;
}
```

ⅳ. ここまで
[gameManageScript]を、空のオブジェクトである[GameManager]に紐付け。prefabである**painting1~gem**と、空のオブジェクトである**p1~p3**をドラッグ&ドロップ！！
![スクリーンショット 2021-08-26 15.26.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/d0229c66-6708-3240-a977-41292686753a.png)

ⅴ. 途中経過を実装
**注意**
>・prefabであるpainting1~gemの座標(インスペクターのtransformのpostion)を**0**にしよう！！
・空のオブジェクトであるp1~p3を分散させよう！！y軸の座標はPlayerと同じにしよう！！

![スクリーンショット 2021-08-26 15.35.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/6537b48b-c391-c86f-e9fa-9010cd3a809c.png)

##3. 宝物に当たったらimageを表示させよう！！

###3-1. 準備
ⅰ. prefabにtag付けをしていこう！！
新しいtagの作り方は、ここでは省略させていただきます。painting1~gemのprefabに、そのままの名前でtag付け
![スクリーンショット 2021-08-26 16.03.43.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/853f49b9-cf00-c9a7-f8ee-f4501f968568.png)

ⅱ. Canvas内に、Imageを作る
Canvas内に、UIから[Image]を作成。ちょうど良い位置に持ってくる！
![スクリーンショット 2021-08-26 16.09.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/79ae6eb4-431c-caa7-a1a4-8ee0ee86625c.png)

ⅲ. 上の[素材の準備]の部分で、インポートした画像を2D sprite化し、その[sprite]を[image]のimageコンポネントに入れる！
![スクリーンショット 2021-08-26 16.15.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/1d44e3a2-615f-1f4a-b051-8a98fc84d066.png)

ⅳ. GameViewを上からの角度で見れるように、カメラの位置をずらす。
![スクリーンショット 2021-08-26 16.20.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/9f3cb28e-32e9-4ecc-9899-dad8fcb1161d.png)

###3-2. playerScriptのコードを書いていこう！

```C#:playerScript
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class playerScript : MonoBehaviour
{

    float speed = 10.0f;

    //後ほど当たり判定で使う。何にあったたかを、Unity上でもわかるように、publicをつける。
    public GameObject painting1;
    public GameObject painting2;
    public GameObject vase;
    public GameObject gem;

    //先ほど、3-1の準備のⅱで、用意したImage
    Image painting1Point;
    Image painting2Point;
    Image vasePoint;
    Image gemPoint;


    //変数共有(getterとsetter)で必要。スクリプトをpublicで変数宣言して、スクリプト同士を紐付ける
    public gameManageScript gamemanagescript;


    void Start()
    {
        //ここでは、"painting1Point"が何の要素を含んで、Unity上の何なのかを代入している。
        painting1Point = GameObject.Find("painting1Point").GetComponent<Image>();
        painting2Point = GameObject.Find("painting2Point").GetComponent<Image>();
        vasePoint = GameObject.Find("vasePoint").GetComponent<Image>();
        gemPoint = GameObject.Find("gemPoint").GetComponent<Image>();

        //上の"enabled"の説明通り。初めは、非表示にして、宝物を獲得した後に、表示するよう、設定したいため、falseにしている。
        painting1Point.enabled = false;
        painting2Point.enabled = false;
        vasePoint.enabled = false;
        gemPoint.enabled = false;


    }

    void Update()
    {
        if (Input.GetKey("up") == true)
        {
            this.transform.position += new Vector3(0, 0, speed * Time.deltaTime);
        }
        if (Input.GetKey("down") == true)
        {
            this.transform.position -= new Vector3(0, 0, speed * Time.deltaTime);
        }
        if (Input.GetKey("right") == true)
        {
            this.transform.position -= new Vector3(speed * Time.deltaTime, 0, 0);
        }
        if (Input.GetKey("left") == true)
        {
            this.transform.position += new Vector3(speed * Time.deltaTime, 0, 0);
        }

    }
    void OnTriggerEnter(Collider col)
    {

        //2-2のⅲの説明のように、ローカル変数として使うので、わざわざグローバル変数にする必要はない。なのでメソッド内で宣言
        //gamemanagescriptにある、Painting1instantiatedを取得して、destroypainting1に代入している
        GameObject destroypainting1 = gamemanagescript.Painting1instantiated;
        GameObject destroypainting2 = gamemanagescript.Painting2instantiated;
        GameObject destroyvase = gamemanagescript.Vaseinstantiated;
        GameObject destroygem = gamemanagescript.Geminstantiated;


        if (col.gameObject.tag == "painting1")
        {

            //"painting1"というタグのついたオブジェクトに当たったら、"painting1Point"を表示させるという意味
            painting1Point.enabled = true;
            //上のローカルで宣言した変数を、ここで活用
            //"painting1"というタグのついたオブジェクトに当たったら、destroypainting1を消す。つまり、"gameManageScript"の"painting1instantiated"を消すという意味
            Destroy(destroypainting1);

        }
        if (col.gameObject.tag == "painting2")
        {

            painting2Point.enabled = true;
            Destroy(destroypainting2);

        }
        if (col.gameObject.tag == "vase")
        {

            vasePoint.enabled = true;
            Destroy(destroyvase);

        }
        if (col.gameObject.tag == "gem")
        {

            gemPoint.enabled = true;
            Destroy(destroygem);

        }
    }
}


```

ⅰ. 下記の設定をする
![mainscene_-_TestProject_-_PC__Mac___Linux_Standalone_-_Unity_2019_4_13f1_Personal__Personal___Metal_.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/84c02ad9-5bad-ed4a-428e-35e1e2bb0a07.png)

ⅱ. 最後の確認

>>
・Playerに、[box collider]と[Rigidbody]が入ってるか
・宝物(prefab)には、[box collider]のみついているか
・宝物(prefab)にtag付けされているか

ⅲ. 実装
![Aug-26-2021 17-12-58.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/989137/cbe6a30d-73e0-bafb-bbf7-e786c6877168.gif)


#コード全容

```C#:gameManageScript
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class gameManageScript : MonoBehaviour
{
    public GameObject painting1;
    public GameObject painting2;
    public GameObject vase;
    public GameObject gem;

    public Transform p1;
    public Transform p2;
    public Transform p3;

    GameObject painting1instantiated;
    GameObject painting2instantiated;
    GameObject vaseinstantiated;
    GameObject geminstantiated;


    public GameObject Painting1instantiated
    {
        get { return painting1instantiated; }
        private set { painting1instantiated = value; }
    }
    public GameObject Painting2instantiated
    {
        get { return painting2instantiated; }
        private set { painting2instantiated = value; }
    }
    public GameObject Vaseinstantiated
    {
        get { return vaseinstantiated; }
        private set { vaseinstantiated = value; }
    }
    public GameObject Geminstantiated
    {
        get { return geminstantiated; }
        private set { geminstantiated = value; }
    }

    void Start()
    {

        GameObject[] treasures =
        {
            painting1,
            painting2,
            vase,
            gem
        };

        Transform[] places =
        {
            p1,
            p2,
            p3
        };


        for (int i = 0; i < 3; i++)
        {


            if (treasures[Random.Range(0, 4)] == treasures[0])
            {
                painting1instantiated = Instantiate(treasures[0], places[i]) as GameObject;
            }
            if (treasures[Random.Range(1, 4)] == treasures[1])
            {
                painting2instantiated = Instantiate(treasures[1], places[i]) as GameObject;
            }
            if (treasures[Random.Range(2, 4)] == treasures[2])
            {
                vaseinstantiated = Instantiate(treasures[2], places[i]) as GameObject;
            }
            if (treasures[Random.Range(3, 4)] == treasures[3])
            {
                geminstantiated = Instantiate(treasures[3], places[i]) as GameObject;
            }
        }
    }
}
```

```C#:playerScript
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class playerScript : MonoBehaviour
{

    float speed = 10.0f;

    public GameObject painting1;
    public GameObject painting2;
    public GameObject vase;
    public GameObject gem;


    Image painting1Point;
    Image painting2Point;
    Image vasePoint;
    Image gemPoint;

    public gameManageScript gamemanagescript;


    void Start()
    {
        painting1Point = GameObject.Find("painting1Point").GetComponent<Image>();
        painting2Point = GameObject.Find("painting2Point").GetComponent<Image>();
        vasePoint = GameObject.Find("vasePoint").GetComponent<Image>();
        gemPoint = GameObject.Find("gemPoint").GetComponent<Image>();

        painting1Point.enabled = false;
        painting2Point.enabled = false;
        vasePoint.enabled = false;
        gemPoint.enabled = false;

    }

    void Update()
    {
        if (Input.GetKey("up") == true)
        {
            this.transform.position += new Vector3(0, 0, speed * Time.deltaTime);
        }
        if (Input.GetKey("down") == true)
        {
            this.transform.position -= new Vector3(0, 0, speed * Time.deltaTime);
        }
        if (Input.GetKey("right") == true)
        {
            this.transform.position -= new Vector3(speed * Time.deltaTime, 0, 0);
        }
        if (Input.GetKey("left") == true)
        {
            this.transform.position += new Vector3(speed * Time.deltaTime, 0, 0);
        }

    }
    void OnTriggerEnter(Collider col)
    {

        GameObject destroypainting1 = gamemanagescript.Painting1instantiated;
        GameObject destroypainting2 = gamemanagescript.Painting2instantiated;
        GameObject destroyvase = gamemanagescript.Vaseinstantiated;
        GameObject destroygem = gamemanagescript.Geminstantiated;


        if (col.gameObject.tag == "painting1")
        {

            painting1Point.enabled = true;
            Destroy(destroypainting1);

        }
        if (col.gameObject.tag == "painting2")
        {

            painting2Point.enabled = true;
            Destroy(destroypainting2);

        }
        if (col.gameObject.tag == "vase")
        {

            vasePoint.enabled = true;
            Destroy(destroyvase);

        }
        if (col.gameObject.tag == "gem")
        {

            gemPoint.enabled = true;
            Destroy(destroygem);

        }
    }
}

```


#終わりに
ところどころ、修正すべきところがあるので、そこを後々直していこうと思います！
最後まで、見てくれてありがとうございました！

〜〜〜〜〜