【Unity】カードゲームでモーダルっぽい感じでカードを選択させる

Unity

Unity初心者です。

現在2Dでシャドバースとかハースストーンっぽいカードゲームを作っているのですが、初心者故にかなり苦戦しています。

実装したソースなどを備忘録としてブログに書いていきたいと思います。

対象となるカードを選択する

TCGを作ると必ず必要になる処理がカードを選択する処理です。

例えば相手にダメージを与える事ができるスキルカードで対象カードを選択させます。その際にユーザーにどのカードが選択可能であるかを示す必要があります。

その時に対象カードを光らせるとかでも良かったのですが、どうせなら画面を暗くして対象カードを中央に並べて選択させたかったです。

(イメージとしてはシャドウバースのカード選択画面ですね。)

↓ダメージスキルを使うと対象選択画面になる(暗転&対象カードを中央に並べる)

対象のカード選択に実装したかった内容と方法

  • 画面を暗くして、対象以外は選択させない(モーダルっぽくする)

→画面全体を覆っている透明なImageを作成。そのImageを黒くしてRayCast Targetをtrueにする。

  • 対象となるカードを画面中央に大きくして並べる

→最前面にHorizontal Layout Groupのオブジェクトを作成して、そこにSetParentする

  • カードを選択したら効果を発動させる

→単純にIPointerClickHandlerで実装

パッと思いついた内容で実装したので、もっといい方法があるかもしれません。

実装した内容

「UI→Image」から適当にクソでかいImageを作成して、最初はRayCast Targetはfalse、アルファチャンネルは0にしておく。

カードの選択処理が始まったら、まずこの画像を暗くして、その下にあるものを選択不可にする。

自分は、「ModalImage」という名前で作ったので以下のような感じ。

Image ModalImage = GameObject.Find("ModalImg").GetComponent<Image>();
ModalImage.color = new Color(0f, 0f, 0f, 0.50f);
ModalImage.raycastTarget = true;

次に対象となるカードを、前面に持ってくる。パネルとかでHorizontal Layout Groupのオブジェクトを作成し、そこにSetParentする。

GameObject FrontField = GameObject.Find("FrontField");
foreach (Card card in cardList) // 移動させたいゲームオブジェクトのリスト
{
    // 対象としたくない物がある場合はここでContinueする

    Hoge.flg= true;  // 静的なクラスでフラグをオンにする
    card.transform.SetParent(FrontField.transform);  // ゲームオブジェクトを移動
}
public static class Hoge
{
    public static bool flg;
}

staticなクラスにフラグとかをもたせておいて、それをtrueの場合だけ処理するようにしています。

カード選択時にそのフラグがtrueだったら効果を発揮させます。カードのゲームオブジェクトのスクリプトに以下を記載しました。

public class CardClick : MonoBehaviour, IPointerClickHandler
{
    public void OnPointerClick(PointerEventData data)
    {
        Card thiscard = GetComponent<Card>();

        if(Hoge.flg) {
            // ダメージを与える処理など

            // モーダル用の画像をもとに戻す
            Image ModalImage = GameObject.Find("ModalImg").GetComponent<Image>();
            ModalImage.color = new Color(0f, 0f, 0f, 0f);
            ModalImage.raycastTarget = false;

            // 処理実施フラグをオフにする
            Hoge.flg = false;
        }
    }

後はカード自体を元の場所に戻す必要があるので、移動開始前のParentやVector3を記憶しておくとかして、それに変更してあげればいいだけですかね。

コメント

タイトルとURLをコピーしました