LoginSignup
1
3

More than 5 years have passed since last update.

画面遷移をpanelでやってみた

Last updated at Posted at 2017-05-25

まずはじめに

Unityで画面をタッチすると次の画面に進んだり、戻ったりするゲームを作りたかった。
それを実現しようとして考えたのが、Sceneの変更とPanelの変更の2通りである。
今回はSceneだと読み込みの時間が重くなってしまうことと、作業する際にわざわざSceneを変えなくてはいけないことをを考慮して、Panelを使った方法を使用した。

これ目標

giphy.gif

さて作る

仕組み

基本的にPanelのSetActiveをonまたはoffにするというScriptを作ることで画面遷移を行う。
Panel上にBottonを作成し、それを押すことで上のScriptが実行。
Panelが変更し、画面が変わる。
完成。

Panelを作る

作成

下の動画のようにPanelを作る
動画の要領でPanelBも作成する。
panelの作成.gif

区別する

Panelが変わったのがわかるようにPanelに色を付ける。
今回はPanelAを青にPanelBを赤にしてみた。
panelの色付け.gif

Buttonの設置

各PanelにButtonを作成する。
そのあとPanelAのButtonのTextに「すすむ」を入れる。
そして、PanelBのButtonのTextに「もどる」を入れる。
Buttonsakusei.gif

Panelを操作する仕組みづくり

ここでは、PanelAからPanelBに変わる仕組みを作る。
つまり、Scriptを書いて、GameObjectにつけるまでをやる。

まずScirptを書く

新しくScriptを開いて、Update()メソッドの下に以下のScriptを書く。

int panelIndex = 0; //今表示しているpanelのindex
public GameObject[] panels;//Panelを入れる箱を用意
public void ChangeIndex (int input){
    panelIndex = input;//引数のinputをpanelIndexに代入する
    Display();
}

//panelIndexのの番号のpanelを画面に表示する
void Display(){
    //for文でiを0からpanelsの長さまで繰り返し1ずつ足していく
    for (int i = 0; i < panels.Length; i++) {
        if (i == panelIndex) {
            //表示したいPanelを決める
            panels [i].SetActive (true);
        } else {
            //それ以外のPanelを表示しない
            panels [i].SetActive (false);
        }
    }
}

書いたScriptをGameObjectに

新しくGameObjectを作り、Scriptをアタッチする。
PanelManagernoyau.gif

アタッチしたら、Inspector>PanelManagerにあるPanel>Sizeの数字を変える。
Panelを入れる箱がその数分発生する。
そこに、PanelAとPanelBをドラッグする。
Panel入れる.gif

これで、ひとまず完成。

画面を変える

最後の作業。
ButtonとScriptを紐付けて、Buttonを押すことでScriptに書いた内容が動くようにする作業。

すすむを押すとpanelBに

PanelA>ButtonのInspector>Button(Script)>On Click()の枠の右下にある + マークを押す。
そして、空いてる箱にPanelManagerをドラッグする。
そして、下のgif画像のように設定していく
button付ける.gif

この画像の最後に打ち込む数字は先ほどPanelをドラッグした箱の番号だ。
下の画像の右下である。
スクリーンショット 2017-05-30 18.24.47.png

もどるを押すとpanelAに

上と同じ要領でButtonとScriptを暇付ける。

再生してみる

完成.gif

完成

完成あ.gif

1
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
3