【Unity ゲーム制作】神経衰弱ゲームを作ろう!〜その5 (カードを選択しよう!)
スポンサーリンク
今回は前回表示したカードオブジェクトを実体にタップ (クリック) してカードをめくる処理を作ってみましょう!
Card.prefabを編集しよう!
Unity 2018.3以降ですとPrefabを選択すると編集モードに切り替わります。
右上のOpenを押してみてください。
Prefabの中身が表示されました。
この状況では、PREFABに新しいコンポーネントを追加するなどの処理を行うことができます。
ただし、変更したら保存しないと反映さ」ないので注意しましょう。
それでは、Card.Prefabをいじってみましょう。
ButtonのTransition を 「NONE」に変更しよう!
Transitionは遷移という意味になります。
初期設定のColoeTintはボタンが選択されたらオブジェクトの色を変化させる処理です。
今回は色を変化させる必要がないため、Transitionの機能をオフにしましょう。
Buttonの要素にある「Transition」をクリックしてNONEを選択してください。
画像の通りになったら成功です!
Card.csに カードを選択した 時の処理を記述しよう!
今度はソースコードに、カードが選択された時の処理を記載します。
Card.csに「OnClick」という関数を作成しましょう。
using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; public class Card : MonoBehaviour { // カードのID public int Id; // 表示するカードの画像 public Image CardImage; // 選択されているか判定 private bool mIsSelected = false; // カードの設定 public void Set (CardData data) { // IDを設定する this.Id = data.Id; // 表示する画像を設定する this.CardImage.sprite = data.ImgSprite; // 選択判定フラグを初期化する this.mIsSelected = false; } /// <summary> /// 選択された時の処理 /// </summary> public void OnClick () { // カードが表面になっていた場合は無効 if (this.mIsSelected) { return; } Debug.Log ("OnClick"); // 選択判定フラグを有効にする this.mIsSelected = true; } }
まずは 変数に bool型のisSelectedを追加しました。
初期設定の時はfalse (未選択)の状態にしておきます。
そして、カードが選択(めくられた)ときにtrue(選択)状態にしています。
Debug.Log は、Unityのコンソール画面にログを表示する関数です。
今回はクリックされたらそれを知らせるようにしております。
Onclick関数はクリックされたとき用の関数です。
これを先程のButtonのOnclickプロパティにアタッチしましょう!
まずはButtonのコンポーネントのOnClickをクリックします。
その後、Card.csをアタッチしましょう。
そうしたら、OnClickと書かれた右上のボタンを押し、出てきた一覧から「Card」→ OnClick()を選択してください。
上の画像の様になれば、ボタンをクリックした時に、OnClick関数が実行する様になりました。
それでは、Gameを起動して実際にカードをクリックしてみましょう!
上記の様にクリックしたらConsoleにログが出現したら成功です!