【UNITY】UIを学ぶ2
![](https://digilab.tech/materials/wp-content/uploads/2018/06/Create@2x.png)
今回は、UIとプログラミングの勉強のためにカウンターアプリを作っていきます。
![](https://digilab.tech/materials/wp-content/uploads/2018/09/X04_01.png)
![](https://digilab.tech/materials/wp-content/uploads/2018/06/Point@3x.png)
この課題を通して、UIの配置方法とプログラミングを学んでいきます。
【プログラミングの要点】
1.ゲームオブジェクトをプログラムであつかう
2.カウンター数を変数にいれる
3.メソッド定義
4.ボタンをクリックしたときにメソッドを呼ばせる
5.テキストをプログラムから更新する
各ボタンの配置
Hierarchy > Create > UI > Buttonでボタン3つ追加します。
Hierarchy > Create > UI > Textでテキストエリア1つを追加します。
![](https://digilab.tech/materials/wp-content/uploads/2018/09/X04_02.png)
プラスボタンの追加
まず図を参考に「+」ボタンの設定(位置)しましょう。
![](https://digilab.tech/materials/wp-content/uploads/2018/09/X04_03-1.png)
Buttonオブジェクト内にあるTextオブジェクトのTextを編集します。あわせてFontSizeも変えていきます。
![](https://digilab.tech/materials/wp-content/uploads/2018/09/X04_04-1.png)
背景の変更
今回はゲームではないので背景が邪魔です。そこで今回は背景を1色で塗りつぶしてしまいます。
Main Camera > Inspector で背景を変更します。
![](https://digilab.tech/materials/wp-content/uploads/2018/09/X04_06.png)
ボタンを押したときに呼ばれるスクリプトを作成
![](https://digilab.tech/materials/wp-content/uploads/2018/06/Coding@2x.png)
1.UnityEngine.UIをUsingします。
2.ボタンオブジェクトを個数分定義します。
3.Startメソッドでボタンオブジェクトがクリックされたときに呼ばれるメソッドを指定。
4.各呼ばれるメソッドを作成
下プログラムの足りない部分を追加してカウンタープログラムを完成させよう!!
☆☆☆で囲まれたところに追加していこう。
プログラミング正解例
![](https://digilab.tech/materials/wp-content/uploads/2018/06/Point@3x.png)
ボタンがクリックされた時に呼ばれるメソッドの指定は、Inspectorで指定することもできます。
【クリック時に呼ばれるメソッドの指定方法(2つ)】
●Inspector > Button > Button > OnClick() の「+」ボタンで指定。
●プログラム上で「ボタンオブジェクト.onClick.AddListener(メソッド名);」で指定。