カードゲームの作り方

【解説通りに作るだけ】デジタルカードゲームの作り方④ カードの動かし方編

みじんこ 2020年7月5日 / 2020年12月30日

前回の解説で手札やフィールドにカード生成することが出来るようになりましたね！

見てない人はこちら参照↓

【解説通りに作るだけ】Unityのデジタルカードゲーム作り方③ 手札の生成編前回でカードとフィールドの作成が完了しましたね！ ※前回の記事はこちら↓ http://yuus01.info/ga...

今回はカードを持って動かせるようにしていくよ！！

完成形としてはこんな感じ！

動かせるようになるとカードゲームらしくなって楽しいよね！！

そんなわけで早速いくぞ！！

Contents

カードを動かす為のコードの実装
- ①②２つのコード記入
- ③④コードの貼り付け（アタッチ）
コードの解説
- ①CardMovementについて
- ②DropPlaceについて
演習
答え合わせ
【最後に】お詫びとか、今後について

カードを動かす為のコードの実装

ではまず、カードを持って動かしたり、フィールドに出せるようにするのに必要な実装の流れを説明していくよ！

流れはザッとこんな感じ↓

①．カードを動かすコードを書く
②．フィールドに置く為のコードを書く
③．カードにコードを貼り付ける(アタッチする)
④．フィールドにコードを貼り付ける(アタッチする)

コードの内容と貼り付け方は後で詳しく説明するから、

とりあえずの流れを頭に入れといて、やりながら「あー今はここをやってるのね」って思いながらやるといいよ！

そんな訳で実際にやっていくぞ！！

①②２つのコード記入

ここではまず
カードを動かすためのコードと、
フィールドに置くためのコードを書いていくよ！

1.スクリプトの作成

では新しいスクリプトを２つ作るよ。

名前は、

“CardMovement”

“DropPlace”

という名前で作ってね。

クラス作成方法が分からないひとは以下を参考にして！！

“CardMovement”と”DropPlace”という名前のクラスが出来たらOK！！↓

それぞれ

カードを動かすためのコード（”CardMovement”）

フィールドに置くためのコード（”DropPlace”）

になってるよ。

2.プログラムの記入

そしたら中身を開いて、中身を丸ごと全部コピぺしよう。

”CardMovement”はこっち↓

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler
{
    public Transform cardParent;

    public void OnBeginDrag(PointerEventData eventData) // ドラッグを始めるときに行う処理
    {
        cardParent = transform.parent;
        transform.SetParent(cardParent.parent, false);
        GetComponent<CanvasGroup>().blocksRaycasts = false; // blocksRaycastsをオフにする
    }

    public void OnDrag(PointerEventData eventData) // ドラッグした時に起こす処理
    {
        transform.position = eventData.position;
    }

    public void OnEndDrag(PointerEventData eventData) // カードを離したときに行う処理
    {
        transform.SetParent(cardParent, false);
        GetComponent<CanvasGroup>().blocksRaycasts = true; // blocksRaycastsをオンにする
    }
}

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

using UnityEngine.EventSystems;

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler

{

public Transform cardParent;

public void OnBeginDrag(PointerEventData eventData) // ドラッグを始めるときに行う処理

{

cardParent = transform.parent;

transform.SetParent(cardParent.parent, false);

GetComponent<CanvasGroup>().blocksRaycasts = false; // blocksRaycastsをオフにする

}

public void OnDrag(PointerEventData eventData) // ドラッグした時に起こす処理

{

transform.position = eventData.position;

}

public void OnEndDrag(PointerEventData eventData) // カードを離したときに行う処理

{

transform.SetParent(cardParent, false);

GetComponent<CanvasGroup>().blocksRaycasts = true; // blocksRaycastsをオンにする

}

”DropPlace”はこっち↓

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

// フィールドにアタッチするクラス
public class DropPlace : MonoBehaviour, IDropHandler
{
    public void OnDrop(PointerEventData eventData) // ドロップされた時に行う処理
    {
        CardMovement card = eventData.pointerDrag.GetComponent<CardMovement>(); // ドラッグしてきた情報からCardMovementを取得
        if (card != null) // もしカードがあれば、
        {
            card.cardParent = this.transform; // カードの親要素を自分（アタッチされてるオブジェクト）にする
        }
    }
}

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

using UnityEngine.EventSystems;

// フィールドにアタッチするクラス

public class DropPlace : MonoBehaviour, IDropHandler

{

public void OnDrop(PointerEventData eventData) // ドロップされた時に行う処理

{

CardMovement card = eventData.pointerDrag.GetComponent<CardMovement>(); // ドラッグしてきた情報からCardMovementを取得

if (card != null) // もしカードがあれば、

{

card.cardParent = this.transform; // カードの親要素を自分（アタッチされてるオブジェクト）にする

}

③④コードの貼り付け（アタッチ）

無事コードが書けたら、今度はUnity側の設定をしていくよ！

まずはCardPrefabに”CardMovement”を張り付けよう。

①．Cardプレハブをクリック
②．右下の「Add Component」をクリック
③．CardMovementと入力して、選択する
④．右のInspecterビューに、CardMovementが表示されればOK！！

≪2020/07/13 追記≫

コメントでご指摘いただいた所についての追記になります。

⑤.上記に加えて「Canvas Group」の追加。(パラメータは上の画像に合わせて下さい)

他にも疑問点、抜けてる点などコメントしていただけるとめちゃくちゃありがたいです！

コメント頂きありがとうございました！！

同じように、PlayerFieldにも”DropPlace”を張り付けよう。↓

そしたら実行ボタンを押す！！

動かせるし、フィールドに出せる！！！

と、そんな感じでカードを自由に動かして出せるようになったかな？？

そしたらコードの解説をしていくよー！

コードの解説

ではカードを動かしてる、
それぞれのコードについて説明していくよ！！

①CardMovement（カードを動かすためのコード）と、

②DropPlace（カードを置くためのコード）の順に説明していくよ。

①CardMovementについて

まずはカードに貼り付けた”CardMovement”のコードについて。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler
{
    public Transform cardParent;

    public void OnBeginDrag(PointerEventData eventData) // ドラッグを始めるときに行う処理
    {
        cardParent = transform.parent;
        transform.SetParent(cardParent.parent, false);
        GetComponent<CanvasGroup>().blocksRaycasts = false; // blocksRaycastsをオフにする
    }

    public void OnDrag(PointerEventData eventData) // ドラッグしてる時に起こす処理
    {
        transform.position = eventData.position;
    }

    public void OnEndDrag(PointerEventData eventData) // カードを離したときに行う処理
    {
        transform.SetParent(cardParent, false);
        GetComponent<CanvasGroup>().blocksRaycasts = true; // blocksRaycastsをオンにする
    }
}

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

using UnityEngine.EventSystems;

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler

{

public Transform cardParent;

public void OnBeginDrag(PointerEventData eventData) // ドラッグを始めるときに行う処理

{

cardParent = transform.parent;

transform.SetParent(cardParent.parent, false);

GetComponent<CanvasGroup>().blocksRaycasts = false; // blocksRaycastsをオフにする

}

public void OnDrag(PointerEventData eventData) // ドラッグしてる時に起こす処理

{

transform.position = eventData.position;

}

public void OnEndDrag(PointerEventData eventData) // カードを離したときに行う処理

{

transform.SetParent(cardParent, false);

GetComponent<CanvasGroup>().blocksRaycasts = true; // blocksRaycastsをオンにする

}

ざっくりまとめるとこんな感じ↓

１.《カードをドラッグし始めた時の処理》→親要素を変更する(10~15行目)
２.《ドラッグ中の処理》→カードの場所をマウスポインターと同じにする(17~20行目)
３.《ドラッグし終わった時の処理》→親要素を変更する(22~26行目)

一番重要な”OnDrag”メソッド

今回一番重要なのが、17行目の”OnDrag”メソッド。

名前の通りだけど、

OnDragメソッドとは、
ドラッグしてる時にこのメソッドの中に書いてある処理を実行するというメソッド。

今回で言うと、
transform.position = eventData.position
なので、

ドラッグしてる間は、
transform.position（カードの場所）を
eventData.position（マウスポインターの場所）にするよ。

っていう処理をしてるってこと！！

他のメソッドについて

次に大事なのが、“OnBeginDrag”と”OnEndDrag”メソッド。

（”OnDrag”メソッドの上と下にあるメソッドのことね。）

これらはそれぞれ、

ドラッグし始めた時の処理（OnBeginDragメソッド）

ドラッグし終わった時の処理（OnEndDragメソッド）

が書かれてるよ。

それぞれメソッドの中に、

transform.SetParent(~,false)

って書かれてるけど、これの意味は

(この場合で言うと)カードオブジェクトの親要素を変更する。ってこと。

親要素って言うのはこれね。↓

今回の動きで説明すると、

ドラッグする前の手札のカード（赤枠で囲ってるカード）の親要素は、PlayerHand。

これをドラッグすると親要素がCanvasに変わる↓

※transform.SetParent(cardParent.parent, false)の処理による結果

ドロップしたらこうなる↓

という処理をここで行ってるよ！

〜Handlerについて

次はクラス名の後ろに書いてあるIDragHandlerとかについての説明。

ここね↓

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler
{
　　（省略）
}

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler

{

　　（省略）

}

ここの部分にいくつか書いてあるけど、

さっき説明した“OnDrag”メソッドを使う時は”IDragHandler“書かないと使えないよ。

って認識でOK。

それぞれ以下に対応してるよ↓

【クラス名】	【メソッド名】
IDragHandler	“OnDrag”メソッド
IBeginDragHandler	“OnBeginDrag”メソッド
IEndDragHandler	“OnEndDrag”メソッド

表の右のメソッドを使うには、対応したクラスを書く必要があるってことね。

継承部分についてもう少し詳しく知りたい人はコメント下さいな。

unityengine.eventsystemsについて

最後にこれ↓

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler
{（省略）}

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

using UnityEngine.EventSystems;

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler

{（省略）}

これもすごくザックリ言うと、

さっき説明した、IDragHandlerとかを使う為に書く必要があるもの。

って認識でOK

これを書かないと使えないので書きましょう。ってだけ。

ここも詳しく知りたい人がいたらコメントくださいな。

②DropPlaceについて

次にフィールドに貼り付けたコードについての解説！

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

// フィールドにアタッチするクラス
public class DropPlace : MonoBehaviour, IDropHandler
{
    public void OnDrop(PointerEventData eventData) // ドロップされた時に行う処理
    {
        CardMovement card = eventData.pointerDrag.GetComponent<CardMovement>(); // ドラッグしてきた情報からCardMovementを取得
        if (card != null) // もしカードがあれば、
        {
            card.cardParent = this.transform; // カードの親要素を自分（アタッチされてるオブジェクト）にする
        }
    }
}

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

using UnityEngine.EventSystems;

// フィールドにアタッチするクラス

public class DropPlace : MonoBehaviour, IDropHandler

{

public void OnDrop(PointerEventData eventData) // ドロップされた時に行う処理

{

CardMovement card = eventData.pointerDrag.GetComponent<CardMovement>(); // ドラッグしてきた情報からCardMovementを取得

if (card != null) // もしカードがあれば、

{

card.cardParent = this.transform; // カードの親要素を自分（アタッチされてるオブジェクト）にする

}

ざっくり、やってる処理としては、

《ドロップされた時の処理》→カードの親要素をアタッチしてるオブジェクトに変える

ってだけ。

なので、この”DropPlace”クラスの親要素を変更する処理をコメントアウトすると、、

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;

// フィールドにアタッチするクラス
public class DropPlace : MonoBehaviour, IDropHandler
{
    public void OnDrop(PointerEventData eventData) // ドロップされた時に行う処理
    {
        CardMovement card = eventData.pointerDrag.GetComponent<CardMovement>(); // ドラッグしてきた情報からCardMovementを取得
        if (card != null) // もしカードがあれば、
        {
            // card.cardParent = this.transform; // カードの親要素を自分（アタッチされてるオブジェクト）にする
        }
    }
}

using System.Collections;

using System.Collections.Generic;

using UnityEngine;

using UnityEngine.EventSystems;

// フィールドにアタッチするクラス

public class DropPlace : MonoBehaviour, IDropHandler

{

public void OnDrop(PointerEventData eventData) // ドロップされた時に行う処理

{

CardMovement card = eventData.pointerDrag.GetComponent<CardMovement>(); // ドラッグしてきた情報からCardMovementを取得

if (card != null) // もしカードがあれば、

{

// card.cardParent = this.transform; // カードの親要素を自分（アタッチされてるオブジェクト）にする

}

置けなくなる！！（実際にやってみてね）

と言うわけで、この処理を行う“DropPlace”クラスをアタッチしたから、カードが置けてる。ってことですな。

演習

今回は割と簡単な演習だからみんなやってみて！

【演習】

現在は自分の手札から、自分のフィールドにカードを置くことは出来るけど、

逆にフィールドから手札に戻すことは出来ない。自分のフィールドから相手のフィールドに置くことも出来ない。

ではフィールドのカードを手札に戻す、あるいは相手のフィールドに出せるようにするにはどうすれば良いか。

ヒントとしては、

コードが貼ってあるから置けるんだよ。

って話。

まあカードゲームとしては有り得ない仕様だけど、練習だと思ってやってみよう！

答え合わせ

出来たかな？？

ただ単にコピペしてるだけだと全く身に付かないから、やり方を覚えながら進もうね。

んで、答えはこう↓

このふたつにDropPlaceをアタッチするだけ！！

変な仕様になっちゃうから終わったらアタッチしたのは消しといてね！！

【最後に】お詫びとか、今後について

更新がめちゃくちゃ遅くなってしまってごめんなさい！！

コメントしてくれた方々ほんとにありがとうございました！

これでもめちゃくちゃ原動力になってます。

記事を書いてる側としては、ほんとにたった一言のコメントでも力になるし嬉しいんです！

なのでほんの1mmでも応援して頂けたり、参考になったという方はぜひコメントをお願いします。

（もちろん「ここがちょっと分かりずらいよ！」などのコメントでも大丈夫です！参考にしますので！！）

その代わりと言ってはなんですが、

7月中にカードゲームの基本動作までの
解説記事を全て書いて投稿します。

（現時点で全く記事のストックとか無いけど。。笑）

具体的には下の動画で言うと、
マナコスト通りにカードを出して、
相手のカードとバトルする所までね。
（スペルカードとか、モンスター効果とかはその後に実装するよ）

ペースとしては週に2回の投稿を予定しています。

なので全10回程度の解説記事になると思います。

そして最終的には「初心者がカードゲームを作りたいなら”みじんこのブログ”を見ればいいよね」って言ってもらえるようなサイトにしたいと思ってます！

その為にはあなたのコメント一つがめちゃくちゃ力になるので、一言でもいいのでコメントの方よろしくお願いいたします！！

新しい記事を投稿したタイミングとか、
ゲームについての役立ち（そうなこと）など
知りたい方はフォローして下さいな→→mijinko_game000

あと質問などあれば、お気軽にどうぞ！！！

次の記事↓

【解説通りに作るだけ】デジタルカードゲームの作り方講座⑤ カードデータの反映編前回までの記事でカードを持って動かせるようになりましたね！！見てない人は前回の記事参考↓ http://yuus0...

前の記事↓

では今回は終わりっ！！

何も知らない初心者がカードゲームアプリを作ろうとした結果www ワクワクが止まらないんだが、、？！！子供の頃から作りたかったゲームをとうとう形にする日が来たと思うとワクワクが止...

Unity初心者がいきなりカードゲームを作るのは無理？？【答え：余裕です】初心者だけど、カードゲームを作ってみたい！！って思って、色々調べてみるとって気持ちになっちゃうよね。 ...

【超自由になれます】Bluetoothイヤホンを使うべき3つのメリットとデメリット突然だけど Bluetoothイヤホン使ってる？？元々ぼく自身「Bluetooth？？なにそれおいしいの？」状態だったので...

Unity カードゲームゲーム作り

POSTED COMMENT

yuki より:

2020年7月13日 3:28 PM

こんにちは。
記事参考になりました。続き楽しみです。

CanvasGroupを使われてますが、AddComponentで「CanvasGroup」も追加しないといけないのではないでしょうか？

1

返信
- みじんこより:
  
  2020年7月13日 6:39 PM
  
  ＞yukiさん
  コメントありがとうございます！
  あ、、完全に抜けてました。
  これだとエラーめちゃくちゃ出ますね。。笑
  すみません、CanvasGroupの追加は必要です！！
  記事に追記したのでよろしくお願いします。
  また何かあったらコメントお願いしますね！
  
  次の記事は今日か明日に出せると思うので、また見て下さい！
  
  返信
もっけより:

2020年9月13日 5:48 PM

凄く参考になりました
Unity初なので大変助かっています
DropPlaceをPlayerHandに入れて実行したら
入れたものがなくなっている現象に見舞われて困っていましたが
実行中に入れても戻るんですね（初心者杉；

1

返信
- みじんこより:
  
  2020年9月14日 7:14 PM
  
  >もっけさん
  コメントありがとうございます^^
  確かに実行中にアタッチしたものは、実行を停止すると消えますね(笑)
  
  困ることも多いですが、特に初心者のうちはミスすればするほど色々知れるので、
  解説に無いことでも気になることはガンガン試しながら作ってみてください！（バックアップは取っておいた方が良いかも。。）
  
  返信
まさきさまより:

2020年9月13日 6:21 PM

大変参考になりました．
質問がありコメントいたしました．

カードの配置に関しての質問です．すでに解説されている内容でしたら申し訳ございません．

カードをきれいに配置する方法は，記事に書いてあり，わかったのですが，
カードをもって，任意の位置に配置することは可能でしょうか？
よろしくお願い致します．

1

返信
- みじんこより:
  
  2020年9月14日 7:36 PM
  
  >まさきさまさん
  コメントありがとうございます！
  カードを固定の位置に配置する方法ですかね？？（遊戯王みたいな？遊戯王やってなかったらごめんなさい。。）
  
  恐らく色々方法はあるとは思いますが、あくまで僕が実装するんだとしたら、
  今ある「PlayerField」の幅を縮めたものを5つ分作って、1枚づつカードを置けるようにしますかね～（フィールドに5体まで出せるようにする場合の話）
  
  って説明で分かりますかね、、？？
  いまいち分からなかったらまたコメント下さい！
  （出来た時もコメントくれたら嬉しい。笑）
  
  返信
  - まさきさまより:
    
    2020年9月14日 10:28 PM
    
    お返事、感謝いたします。
    わかりやすい解説ありがとうございました。
    今後もよろしくお願いいたします。
    
    1
    
    返信
ピーロより:

2020年9月21日 11:43 AM

いつも参考にさせて頂いてます
CardMovementのスクリプトを作成して、プログラムを記入したのに、
Add Componentをクリックして
CardMovementで検索してもCardMovementが表示されません
どういった原因が考えられますでしょうか？

1

返信
- みじんこより:
  
  2020年9月23日 9:26 AM
  
  >ピーロさん
  コメントありがとうございます！
  
  んー、一番多いのは、コードに書かれているクラス名が間違っていることですかね。
  なので一旦、コードのクラス名と検索した時のクラス名にスペルミスが無いかを確認してみて下さい！
  
  特に間違ってなければ、、、(´･ω･`)ﾅﾝﾀﾞﾛｳ
  
  返信
ラいより:

2020年9月25日 12:50 PM

コードに関しての質問です。コードを映しても書くやつで参照なしとなってしまい、動きません。
どうしたらいいのでしょうか？
Logを出そうとしてもOnBeginDrag・OnDrag・OnEndDrag・OnDrop
が動きませんでした。

1

返信
- みじんこより:
  
  2020年9月25日 5:41 PM
  
  >ラいさん
  コメントありがとうございます！
  返信遅れてすみません、届いてますよ！
  
  んー、CardMovementとDropPlaceクラスの話ですかね？
  
  ４行目の
  using UnityEngine.EventSystems;
  は書いてありますか？
  
  これが書いてないと、動かないので一旦確認してみて下さい！
  ちなみにコードにエラーは出てないってことでいいですよね？？
  アタッチは出来てない状況なんですかね、、？？
  
  >コードを映しても書くやつで参照なしとなってしまい、動きません。
  あとこの”書くやつ”って言うのが分からなくてなんとも、、、
  どこのことでしょうか、、(´・ω・｀)ｺﾞﾒﾝﾖ
  
  返信
ラいより:

2020年9月26日 1:16 PM

using UnityEngine.EventSystems;は書いてありますね。エラーは出てません。public void OnBeginDrag(PointerEventData eventData)などの上に普通ならUnity　メッセージ□個の参照と表示されるはずなのですが、0個の参照となって動きません。ということです。わかりにくくてすみません。

1

返信
- みじんこより:
  
  2020年9月26日 3:35 PM
  
  >ラいさん
  あー、なるほど！分かりました！
  OnBeginDragメソッドなどは、メソッドを別のところから呼び出してる訳ではないので０個の参照と表示されていて問題ないです。
  コードにエラーが出てないのなら、プログラムにミスはないと思います。
  
  “動かない”とありますが、実行ボタンを押した後に、カードをドラッグしても動かないってことですかね？
  Cardプレハブにアタッチはされましたか？？
  
  解説通りにアタッチしてて、動かないなら、、(-ω-)ﾅﾝﾀﾞﾛｳ､､
  
  返信
ラいより:

2020年9月26日 7:25 PM

あと、カードがPlayerFieldの下になってしまうのはどうしたらいいでしょうか？

1

返信
- みじんこより:
  
  2020年9月26日 9:10 PM
  
  >ラいさん
  えーと、まずカードは動くようになったってことですかね？？
  
  私としても初心者の方に分かりやすいサイトを作ろうと思ってるので、質問していただくのはむしろウェルカムなのですが、流石に「今は～という状況で、…が出来ない」「これが原因だと思って、～と～を試したけど…になってしまう」など、今の状況を詳細に説明して頂かないと答えようがないです。。
  解説してる通りの動きをしてない時点で、もうどんな状況になってるのか分からないので、、
  
  質問内容を整理してると、案外自分で解決出来たりしますし、色々分からないながらも直すのはめちゃくちゃ勉強になると思います。
  （あと僕がコメントを見て答えるより、自分で頑張った方が早い場合もあると思うので。笑）
  
  一旦、「原因は何かな？？」って色々悩みながら試して、それでも解決しなかったらまたコメント下さい。
  詳細を説明していただければ、力になれるかも知れないので！！
  
  返信
ラいより:

2020年9月26日 10:52 PM

わかりました！ありがとうございます。頑張ってみます！(でもできることもうなさそう…)

1

返信
トキムネより:

2020年9月27日 1:03 AM

すいません、今「ドラッグしたけど攻撃しなかったカードをもとの位置に戻す」というようにコードを書き換えようとしています(今だと一度クリックしたカードは必ず一番右に動いてしまうので)

考え方として、CardMovementのOnBeginDragで動かす前のCardの親OriginalCardPosition、位置OriginalCardParentを保存しておき、OnEndDragで「Drag前と親が変わっていなければ親と位置をOriginalCardPosition、OriginalCardParentにする」という処理がいいかなと思うのですが

public void OnBeginDrag(PointerEventData eventData) // ドラッグを始めるときに行う処理
{
Transform OriginalCardPosition = transform.position;
Transform OriginalCardParent = transform.parent;

cardParent = transform.parent;
transform.SetParent(cardParent.parent, false);
GetComponent().blocksRaycasts = false; // blocksRaycastsをオフにする
}

ではTransform OriginalCardPositionのところでエラーになってしまいました。
現状あまりtransformの使い方を理解できていないのですが、どうやって元のカード親・位置を取得すればよいでしょうか？

1

返信
- みじんこより:
  
  2020年9月27日 8:57 PM
  
  >トキムネさん
  あー、確かに気になりますよね。。笑
  あとで「バグ修正」的な記事で解説しようとは思ってたので、細かい解説はそっちで。。。
  
  で、肝心のやり方ですが、考え方としては完璧です！！(・ω・)ｽﾊﾞﾗｼｲ!
  ただ使うコード（position）がちょっと違いますね！
  
  今回、Cardの位置が変わってしまうのは、Hierarchy上でCardの位置が入れ替わってることが原因です。
  試しにゲーム実行中にPlayerFieldのCard（子要素）の順番をHierarchyビュー上で動かしてみて下さい。
  ゲーム上でもカードの順番が変わると思います。
  
  つまり今回重要なのは「子要素の順番」です！！
  そしてこれを変更するコードは、“SetSiblingIndex”です。
  ※ちなみに元の子要素の順番を取得するコードは、“GetSiblingIndex”です。
  
  このコードを使って実装できるので、是非色々試してみてください！！（ちょっと難しいかも知れないですけど、演習だと思って頑張って下さい！）
  分からなかったらまた聞いて下さいー！
  
  参考：https://unity-yuji.xyz/change-hierarchy-order/
  
  返信
ラいより:

2020年9月27日 9:12 PM

できました！Imageを使わないでやってたようでした。ありがとうございます！

1

返信
トキムネより:

2020年9月29日 7:31 PM

できました‼

using(略)

public class CardMovement : MonoBehaviour, IDragHandler, IBeginDragHandler, IEndDragHandler
{
public Transform cardParent;//
Transform OriginalParent;//元のカードの親を入れる
int Cnamber;//元のカードの順番を入れる

public void OnBeginDrag(PointerEventData eventData) // ドラッグを始めるときに行う処理
{
OriginalParent =this.transform.parent;
Cnamber = this.transform.GetSiblingIndex();

(元のOnBeginDragの処理を書く)
}

public void OnDrag(PointerEventData eventData) // ドラッグした時に起こす処理
{
(略)
}

public void OnEndDrag(PointerEventData eventData) // カードを離したときに行う処理
{
if (OriginalParent == cardParent)
{
transform.SetParent(OriginalParent, false);
transform.SetSiblingIndex(Cnamber);
GetComponent().blocksRaycasts = true; // blocksRaycastsをオンにする
}
else
{
(元のOnEndDragの処理を書く)
}
}
}

現状変な挙動していないのでこれで正解だと思います！
わざわざ参考URLまで教えていただき助かりました！
いつもコメントに反応していただき本当に助かってます。本当にありがとうございます！

1

返信
- みじんこより:
  
  2020年10月3日 1:15 PM
  
  >トキムネさん
  おー！！！素晴らしい！！！
  120点です！！完璧です！笑
  
  ほぼ思っていた通りのコードになっていて、ちゃんと動いているので問題ないと思います！
  （ちょっとだけ言うとnamberじゃなくて、numberかな。笑
  　でもぶっちゃけコードなんて動けばいいと思ってるので気にすることなしです！笑　完璧です！！）
  
  こちらこそいつもコメントくれるので僕も助かってますよ！
  今後ともよろしくお願いしますね～
  
  返信
アツシより:

2020年11月23日 7:55 AM

いつもありがとうございます！！３日前にUnityダウンロードしたばかりでさっそく挫けかけてましたが、こちらの記事を見ながらだと楽しく出来てます！！
カードが動くことに感動してお礼の連絡でした！！
頑張って最後まで続けたいと思います！！

1

返信
- みじんこより:
  
  2020年12月3日 8:30 AM
  
  ＞アツシさん
  始めたばかりだと分からないことばっかりですよね。笑
  感動してもらえて嬉しいです(*´ω｀)笑
  まだ完結してないですが、頑張ってください！！
  
  返信
りんごより:

2020年12月1日 8:02 AM

初めまして！
私は高校時代にHTMLを齧っただけのスキルしかないですが、
みじんこさんの分かりやすい記事のおかけで新しい趣味が広がりそうです！
応援してます！

1

返信
- みじんこより:
  
  2020年12月3日 8:34 AM
  
  ＞りんごさん
  わー、ありがとうございます、嬉しいです(*´ω｀)
  僕はHTMLも書けないんで、りんごさんはもっとガンガン作っていけると思います！笑
  ゲーム作成はめちゃめちゃ楽しい趣味になるので、一緒にやっていきましょう！！
  
  返信
りんごより:

2020年12月2日 12:18 AM

すみません。早速詰みました。
コードの記載（フルコピペ）、カードプレファブへのアタッチ、グループ全て記載通りで問題ないかと思いますが、プレビュー（再生ボタン）を押してからドラッグしてもカードが移動しません。手札が5枚とフィールドに5枚の計10枚ですが、どのカードも動かないです。
ここまで順調にできてたので全く原因がつかめないです。。

1

返信
- みじんこより:
  
  2020年12月3日 8:45 AM
  
  ＞りんごさん
  んー、なんでしょう。。
  カードの移動処理を実装してるのは、
  該当記事の「③④コードの貼り付け（アタッチ）」の章の部分なので、そこはもう一度よく確認いただけますか？
  特に⑤で解説してる「Canvas Group」の「Blocks Raycasts」をオンにしているかどうかを確認してみて下さい！
  
  返信
  - 匿名より:
    
    2020年12月3日 10:44 PM
    
    みじんこさん
    初日の作業から１から作り直ししてみましたがやはり動かず。。お手上げです＞＜；
    
    1
    
    返信
  - りんごより:
    
    2020年12月4日 10:44 PM
    
    何度もすみません。
    解決しました！
    Hierarchyタブにeventsystemフォルダがなかった（おそらく自分で消した）ことが原因だったみたいです！
    これでようやく次のステップへ行けます！
    お騒がせしました＞＜；
    
    1
    
    返信
りんごより:

2020年12月3日 9:51 PM

＞みじんこさん
問題なくアタッチもできていて、Blocks Raycastsもチェックされているように見えます。
私のの何かのミスかと思いますので復習かねて１からやり直してみます！

1

返信
ネコヤナギより:

2021年2月2日 5:22 PM

（お礼のみ）
みじんこさん、とても楽しく読ませていただいています。間違って戻っての繰り返しですが１ヶ月でようやくここまで終わりました。自作のカードゲームをリリースするために頑張っています。みじんこさんの記事はどのページよりもわかりやすくて、飽き性の私でもモチベーションを維持したまま学習できていて、本当にありがたいです。

1

返信
- みじんこより:
  
  2021年2月10日 8:38 AM
  
  >ネコヤナギさん
  (なんかいい名前ですね笑)
  コメントありがとうございます！
  自作のカードゲームいいですね〜
  どんなの作ってるのか見てみたいですね〜笑
  リリースまで大変だと思いますが、ゲーム作るのが好きなら楽しめると思います！頑張って下さいー！
  
  返信
じゃがすけより:

2021年3月1日 1:47 AM

相手のカードも動かせてしまうので、動かせないようにしたいです！
どうしたらできるのでしょうか？

1

返信
- みじんこより:
  
  2021年3月1日 5:53 AM
  
  >じゃがすけさん
  んー、bool enemyCard など作って、CardMovementに enemyCardがtrueならreturnする。という処理を書けば動かさない様に出来ますね。
  もしくは解説記事⑨まで進めてもらえると相手のカードは動かせなくなるので、そこまで進めてみて下さい！
  
  返信
じゃがすけより:

2021年3月1日 2:32 PM

>みじんこさん
回答ありがとうございます！後先読まずに質問しちゃってすいません（汗
解説最後まで読み進めたいと思います！

1

返信
- みじんこより:
  
  2021年3月1日 6:35 PM
  
  >じゃがすけさん
  いえいえー！
  また何か知りたいことがあったらコメントで教えて下さい(‘ω’)
  
  返信
かなもんより:

2021年4月19日 1:56 AM

趣味でUnityをはじめました。大変参考にさせていただいております。
「CardMovement.cs」について質問させてください。

OnBeginDragとOnEndDragの「SetParent」で設定している値が異なりますが、ここがいまいちわかりませんでした。
何がちがうのでしょうか？

1

返信
- みじんこより:
  
  2021年5月12日 7:49 AM
  
  ＞かなもんさん
  返信めちゃくちゃ遅くなってすみません！！
  
  これは単にカードをドラッグしている時に、
  カードが他の要素の下にならないように親要素をCanvasに変更してるってだけです。笑
  
  どっちも同じように、
  OnBeginDragの方でもcardParentを親にしてカードを動かしてみると分かるかと思います！
  
  って回答で大丈夫ですかね、、？？
  
  返信
匿名より:

2021年4月21日 2:22 PM

今回もわかりやすかったです。
毎回レッスンのあとにちゃんと自分で考える作りになっていてとてもよい（語彙力0）

1

返信
- みじんこより:
  
  2021年5月12日 8:50 AM
  
  コメントあざっす！(語彙力)
  
  返信
匿名より:

2021年7月13日 4:05 PM

フィールドに出せるカードを上限五枚にするにはどうすればいいですか？

1

返信
- みじんこより:
  
  2021年7月24日 11:54 AM
  
  >匿名さん
  フィールドにカードが5枚より少ない時に、カードを置けるようにすればいいので、
  カードを置く処理のところに
  if(子要素の数<5)
  {カードをフィールドに置く処理}
  というような分岐を書いてみると実装出来るかと思います！
  
  調べつつ色々試してみて、それでも分からなければ、
  具体的に分からない部分をまた聞いて下さいー！
  
  返信
まーぼうより:

2021年10月2日 3:53 PM

３Ｄのタイル状にどうやったらオブジェクトをドラッグアンドドロップできるか悩んでいたので、とても参考になりました。
レイキャストの座標が入った空オブジェクトに入れるとなんとかできそうです。
このサイトの説明順序がとてもわかりやすくて助かります。

返信

COMMENT コメントをキャンセル

Unity初心者がいきなりカードゲームを作るのは無理？？【答え：余裕です...

記事を更新出来なかった事への謝罪というか言い訳的な記事

【解説通りに作るだけ】デジタルカードゲームの作り方④ カードの動かし方編

カードを動かす為のコードの実装

①②２つのコード記入

1.スクリプトの作成

2.プログラムの記入

③④コードの貼り付け（アタッチ）

コードの解説

①CardMovementについて

一番重要な”OnDrag”メソッド

他のメソッドについて

〜Handlerについて

unityengine.eventsystemsについて

②DropPlaceについて

演習

答え合わせ

【最後に】お詫びとか、今後について

Unityの初心者向けのチュートリアルすら難しくて心がめげた話【ゲーム制作 2日目】

【解説通りに作るだけ】Unityのデジタルカードゲーム作り方①　カードを作る編

何も知らない初心者がカードゲームアプリを作ろうとした結果www

Unity初心者がいきなりカードゲームを作るのは無理？？【答え：余裕です】

POSTED COMMENT

COMMENT コメントをキャンセル

カードを動かす為のコードの実装

①②２つのコード記入

1.スクリプトの作成

2.プログラムの記入

③④コードの貼り付け（アタッチ）

コードの解説

①CardMovementについて

一番重要な”OnDrag”メソッド

他のメソッドについて

〜Handlerについて

unityengine.eventsystemsについて

②DropPlaceについて

演習

答え合わせ

【最後に】お詫びとか、今後について

Unityの初心者向けのチュートリアルすら難しくて心がめげた話【ゲーム制作 2日目】

【解説通りに作るだけ】Unityのデジタルカードゲーム作り方① カードを作る編

何も知らない初心者がカードゲームアプリを作ろうとした結果www

Unity初心者がいきなりカードゲームを作るのは無理？？【答え：余裕です】

POSTED COMMENT

COMMENT コメントをキャンセル

【解説通りに作るだけ】Unityのデジタルカードゲーム作り方①　カードを作る編