カードゲームの作り方

【解説通りに作るだけ】デジタルカードゲームの作り方講座⑤ カードデータの反映編

 

前回までの記事でカードを持って動かせるようになりましたね!!

見てない人は前回の記事参考↓

【解説通りに作るだけ】デジタルカードゲームの作り方④ カードの動かし方編 前回の解説で手札やフィールドにカード生成することが出来るようになりましたね! 見てない人はこちら参照↓ http:/...

 

今回は実際のカードデータを反映していくよ!!

前回までのカードはただの仮置きのデータなので、今回から本物のデータを持たせて、表示させるよ!

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

今回から実際にカードを作っていくので、楽しいぞー!!笑

というわけで行くぞ!!

 

【作業全体の説明】カードデータ作成と反映

まずはザックリ今回の作業の流れを説明します。

①4つクラスを作る
コードを書く
③Unity側の設定をする(アタッチ等)

ザックリ言うとこれだけ。

 

ただこの今回作る4つのコードってのがめっちゃ大事で、それぞれのスクリプトがそれぞれの役割を持ってます。

表にまとめるとこんな感じ↓

【クラス名】 【役割】
Card Entity カードデータそのもの
CardVeiw カードの見た目を管理する
CardModel カードのデータを管理する
Card Controller カード全体を管理する

ここがよく分からないまま進むと後々「ん?何言ってんのこいつ?( ˘ω˘ )ワケワカラン」ってなるので、なんとなくでいいから「このスクリプトはこの役割だからこの処理をやってるのね。」って理解しながら進めてね。

 

コードの作成&記入

まずはスクリプトを4つ作ろう!

4つの名前はこれね↓

  • CardEntity
  • CardModel
  • CardView
  • CardController

こんな感じに無事4つ分作れたら、早速コードを記入していこう!!

とりあえず丸々コピペで大丈夫だよ!

 

CardEntityのコードはこれ↓

 

CardModelのコードはこれ↓

 

CardViewのコードはこれ↓

 

CardControllerのコードはこれ↓

無事全部に張り付けられたかな??

どこかしらにエラーとか出てないか軽く確認して、特にエラーがなければ次にいくよ!

 

コード追記

次は前に作ったGameManagerスクリプトに対しても、ちょっと追記をしていくよ!

たぶん今は、以前に書いた
Instantiate(cardPrefab, playerHand);
とかが書いてあるので、
Startメソッドに書いてある処理は全部消していいよ!

そしたら以下の様にコードを書き換えよう↓

詳細はあとで説明するけど、

要はゲーム実行したらStartGameメソッドが動いて、
Card1ってカードを出すよ!って処理をしてるよ。

 

Unity側の設定

コードが書けたらUnity側の設定をやってこう!!

やることとしては2つだけ!

・カードの作成
・アタッチ

ではやっていこう!!

 

カードの作成

では今回の一番楽しいところ!!

実際のカードを作ってくよ!!

と言いたいところだけど、
その前にフォルダを作ったりちょっとした前準備をしてくよ。

手順に沿って作ってこう↓

 

まずはカードデータとかを保存するフォルダを作るよ。

※まず「Assets」フォルダに移動してね!!

①「+」をクリック
②「Folder」をクリック
③「Resources」という名前を付ける
④「Resources」フォルダにCardプレハブをドラッグ&ドロップ
⑤「Resources」フォルダをダブルクリックして、中に入ろう

 

①先ほどの手順と同じく「CardEntityList」フォルダを作る
②「CardEntityList」フォルダをダブルクリックして中に入る

 

ここからカードデータを作ってくよ!!

①「+」をクリック
②「Create CardEntity」をクリックする
③こんな感じのが出来る(Unityのバージョンによって多少見た目に違いがあるかも)
④出来たやつの名前を「Card1」に変える

 

①クリックして、パラメータを画像通りに設定しよう
②「◎」みたいなのをクリックする
③アイコンはこれを選択する

これで1枚目のカードが完成!!!

 

同じ手順で今度は「Card2」を作ろう。

ちなみに新しく作るときは、Card1をクリックして、「Ctrl+D」でコピー出来るよ。

こんな感じになればOK!!

 

アタッチ

次はさっき作ったコードをCardプレハブにアタッチしよう!

①「Card」プレハブをクリック
②「AddComponent」をクリックして、「CardController」と「CardView」を検索して、選択する
③「CardController」と「CardView」の二つが張り付けばOK!
④「OpenPrefab」をクリックしよう

 

①Card(左側)から「Name」を、左の「NameText」に張り付ける。
②この貼り付けを「Cast」「Power」「Image」も同じように行う

 

ここまで出来たら最後に「GameManagerオブジェクト」にCardプレハブをアタッチしよう!!

①「GameManager」オブジェクトをクリック
②Cardプレハブをドラッグ&ドロップ
③こんな感じに「CardPrefab」に張り付けばOK!!

 

 

ではゲームを実行してみよう!!

今までとは違うカードが出てきた!!!!

 

他の種類のカードを出すには??

ひとまず新しく作ったカードを表示することは出来るようになったけど、まだ1種類のカードしか出せてない!!

というわけで他のカードも出せるようにしていくよ!

 

GameManagerにコードを追記して、Card2も出せるようにしていこう。

※オレンジ部分を追記してね↓

 

これで実行すると、

自分のフィールドに2番目に作ったカードも出てきた!!

 

これはどうやったかと言うと、下のコードの処理によるもの。

CardController card2 = Instantiate(cardPrefab, playerHand);
≪和訳:PlayerHandにCardPrefabを出しますよ。そして出したものを「card2」としますよ。≫

card2.Init(2);
≪和訳:card2は「Card2」として表示させますよ。≫

(以下、何度か繰り返し)

Initの後ろの()の中の数字が、さっき作ったCard1とかCard2を指してるので、ここを書き換えることで好きなカードを出せるようになる!!ってことだね。

例えば、Initの()の中に「1」と書いて、
Instantiate(cardPrefab, playerField)と書き換えたら、
Card1のカードが、自分のフィールドに出る。
ってことだね。

まあ好きなようにいじってみるとわかると思うよ!!

 

要はこれを書いていけばどんどん色んなカードを好きな場所に出せるようになる!!ってことですな!

 

、、、でもこれいちいち書くの面倒くない??

 

「CreatCard」メソッドの作成をしよう

というわけで、カードを作りだす処理をメソッド(関数)にしてまとめよう!!

オレンジの部分が変わってるので、張り替えて実行してみよう↓

さっきと同じようになったかな??

でもさっきよりスッキリしたコードになってるよね!

これは「何度も繰り返す処理」をCreatCardと言うメソッドにしたことで、何度も同じようなコードを書かずに済んだから。ってことだね。

なので今後も何度も同じ処理をするような場合は、メソッドにまとめちゃった方がいいよ!

コードの詳細は次で説明してきます!!

 

コードの解説

今回はいろいろ出てきたので、ざっくりと説明していくよ!!

いきなり読んでも初心者の人はたぶん全部は理解できないと思うけど、

「20%くらい分かったわ!!」で全然OK!!

分かんなくて手が止まっちゃう事の方が勿体ないので、雰囲気だけ掴めれば次にドンドン進んでいって大丈夫だよ!!やってる内にそのうち分かるようになるから。笑

ではいくぞ!!

 

「CardEntity」について

このスクリプトは、
カードデータそのもの!!

「どういうことだよ!!!」って人は、下記のオレンジ部分のコードを追記してみよう↓

例えばだけど、Rarity(レアリティ)を付けてみる

 

コードを追記したら、カードデータを見に行くと。

パラメータが増えてる!!!!

というわけ。(Legendは勝手に書いただけね。笑)

なのでカードのデータをいじりたかったらCardEntityをいじればいい。ってことですな。

※後で戻しておいてね!!

 

「CardModel」について

このスクリプトは、
バトル中のカードデータを管理してるもの!!

カードのデータ自体はCardEntityが持ってるけど、

  • 自分のカードなのか、敵のカードなのか
  • 攻撃できる状態なのか、召喚酔いしてるのか
  • 手札のカードなのか、フィールドに出てるのか

っていうバトル中のデータに関してはバトルによって変わるじゃん??

そういうバトル中のデータを持ってるのがCardModel

だから今後、「このカードは召喚酔いしてるから攻撃できない」とか「自分のカードなのか、敵のカードなのか」とかいうのは、CardModelが管理していくよ!!

 

「CardView」について

このスクリプトは、
バトル中のカードの見た目を管理してるもの!

CardEntityからカードデータそのものを受け取って、CardModelでそのカードデータを持ってても、ゲームの画面に表示されないと意味ないよね。

そこで名前とか、パワーとか色んなデータを表示してるのが、このCardView。

今後出てくる、「攻撃できる状態のカードを光らせる。」という処理はここが管理することになるよ!!

 

「CardController」について

このスクリプトは、
今までのカードに関係するスクリプトをまとめるもの!
という認識でOK

これから出てくるカードは全てCardControllerを使って処理していくよ。

 

「GameManager」について

GameManagerは、今回追記した処理の説明をしてくよ。

今回大事になるのが、CreatCardメソッド!!

CreatCardメソッドってのは、8~12行目のやつね。

このメソッドは何をしてるのかというと、
「カード番号(int cardID)と場所(Transform place)を教えたら、その通りカードを出します!!」
って処理をしてるよ。

日本語で言うと、
CreateCard(出したいカードの名前(番号), 出したいカードの場所)
ってこと。

このCreatCardの後ろの()の中の値を「引数」っていうんだけど、いまいち分かんない人は「C# メソッド(関数)」「C# 引数」とかで軽く調べた方がいいかも!!

 

以上!!!
ものすごくザックリとした説明だったけど分かったかな??

もうちょっと説明が必要なところがあったらコメント下さい!

 

【演習】カードの作成と表示

では最後に理解度チェックとして演習をやっていこう!!

演習としては、
コードでこの状況を作ってみよう!!↓

ヒントとしては、

・新しいカードを作って、
・カードをそれぞれ表示させる。

って処理が必要だね。

ではやってみよう!!

 

【演習】答え合わせ

出来たかな??

答えとしては、
Card3を作って、StartGameメソッドに下の処理を突っ込むだけ!

こんな感じで、今回は細かいコードの中身より、それを使って好きなカードを作って、それを好きな場所に表示できるようになれればOKだよ!!

 

まとめ

今回で好きなカードを作って、好きなように出せるようになったね!!

次の記事ではデッキを作って、ドローフェイズやターンエンドなど、ターン制御部分を作っていくよ!!

どんどんカードゲームっぽくなって楽しくなるね!!

楽しみながらちょっとずつ作ってこ!

ではでは今回はここまで!!

 

あ、あと最後に。
一言でもコメント頂けるとめっちゃやる気が上がります!
そして更新頻度も上がります。笑

どんな質問でも、ご指摘でも歓迎ですのでお気軽どうぞ!

ってなわけで今回は終わりっ!!

また次回!!

 

次の記事↓

【解説通りに作るだけ】Unityのデジタルカードゲーム作り方講座⑥ ターンフェーズ作成編 前回までの記事で、実際にデータを持ったカードを自由に出せるようになりましたね!! 前回の記事を見てない人はそちらを参考↓ ...

前の記事↓

【解説通りに作るだけ】デジタルカードゲームの作り方④ カードの動かし方編 前回の解説で手札やフィールドにカード生成することが出来るようになりましたね! 見てない人はこちら参照↓ http:/...

 

【参考】

[Unityゲーム開発] シャドバ風!?カードゲームの作り方 #3 カードデータの生成

 

Unity初心者がいきなりカードゲームを作るのは無理??【答え:余裕です】 初心者だけど、カードゲームを作ってみたい!! って思って、色々調べてみると って気持ちになっちゃうよね。 ...
【Unity】デッキ(リスト)をシャッフル(ランダムに)する方法【コピペで完成】 ってことあるよね。 僕自身シャッフルの仕方がわからなくて困ってたけど、 案外簡単な方法で出来たので、...
【Unity】クリック時に処理を起こす方法【コピペで完成】 ってこと、あるよね。 実際に見せるとこんな感じ↓ 実際にやってみると超簡単だ...

 

ABOUT ME
みじんこ
【名前】みじんこ(ここのブログ書いてるひと) ・大学2年の時に「ゲームが作りたいー!!」って思ったのに、ゲームの作り方を解説してるサイトがことごとく何言ってんのか分かんなくて挫折した。 ・数年な時を経て「だったら俺が完全初心者にも超わかりやすいサイトを作ってやんよ!」って事で、初めてゲームを作ろうとしてる方向けに解説記事を書いてるよ。

POSTED COMMENT

  1. こゆの より:

    毎回毎回分かりやすい解説をしてくださってありがとうございます。
    本当に先生と呼ばせていただきたいです!
    次回の解説も楽しみに待っています!!

    • みじんこ より:

      >こゆのさん
      コメントありがとうございます!
      せ、先生だと、、、!!
      嬉しいです。笑(=´∀`)

      ちょっと複雑になってきましたけど、大丈夫そうですかね??
      少しずつ理解しながら一緒に作っていきましょう!

  2. トキムネ より:

    すいません、CreatCardEntityをCardEntityListの中に出すことができません
    Assetの中にResourcesを作成し、その中にCardEntityListを作るところまではできました。
    その後、CardEntityListを開き+ボタンを押したのですがCreatCardEntityがどこにも見つかりませんでした。
    バージョンによっては名前が変わるなどあるのでしょうか?

    • みじんこ より:

      >トキムネさん
      コメントありがとうございます。
      「+」を押しても「Create CardEntity」ボタンが出てこないっていう事ですね!
      こちらで事象を試してみましたが再現しなかったです。。
      他にも同じようなことが起きたってコメントもないですしね~。。(-ω-) ンー

      とりあえず言えることしては、
      「+」を押したら出てくるはずの「Create CardEntity」ボタンは、
      「CardEntity」クラスの5行目の[CreateAssetMenu(fileName = “CardEintity”, menuName = “Create CardEntity”)]のコードによって作成されるボタンです。
      つまりこのコードを消したら僕の「Create CardEntity」ボタンも消えます。
      なのでその行にスペルミス等ないか確認してみて下さい!

      (あとはちゃんとコードを保存出来てるか、Unity側が読み込むまでちょっと待つとかかなぁ。。)

  3. はじめ より:

    コメント失礼します。いつもゲーム制作の参考にさせてもらってます。
    質問なのですが、
    Cardプレハブにアタッチする際に「Add Component」で「CardController」と検索しても出てこず、アタッチすることが出来ないでいます。「CardView」はアタッチすることが出来ました。
    ご教授いただければ幸いです。

    • みじんこ より:

      >はじめさん
      コメントありがとうございます。
      コメント反映されてますよ!
      すみません、こちらで承認しないと見えないようになってるんです。。笑

      では本題の「CardController」がアタッチ出来ない件ですが、
      コードの名前にスペルミスが無いかを確認してもらえますか?

      「CardController」コードの5行目、
      public class CardController : MonoBehaviour の、
      このclaasの後ろの名前(CardController)と、コードの名前が一致してないとアタッチ出来ないです。

      もう一度コピペ等して、間違いがないように張り直してみてから、アタッチ出来るか確認してみて下さい!!

      • はじめ より:

        お返事遅れまして申し訳ございません。
        ご回答ありがとうございます。

        コードを何度も確認しましたが、ミスはなさそうです。こちらのサイトのコードをコピペして何度も試してみましたが、アタッチすることが出来ないです。

        クラス名とコードが一致していないとアタッチすることが出来ないとのことですので、クラス名からコピペしたり、その逆にコード名からコピペしたりしましたが、やはりアタッチすることが出来ないですね・・・。

        ほかに何か問題があるかもしれないので、もう一度一から作り直してみたいと考えております。

        • みじんこ より:

          >はじめさん
          んー、、、力になれずすみません。。(´-ω-`)

          初めから作り直すのは1回目と違って、
          作業の意味を理解した上で作ることになるので、めちゃくちゃはじめさんの力にはなると思います。

          大丈夫だと思いますが、また同じように作っていただいた後も事象が再発するようならまたコメント下さい!
          全面的にこちらでも記事を見直しますので!

          うまく進めることを祈っています。

  4. トキムネ より:

    ミジンコさん
    ご解答ありがとうございます。
    念のため確認したいのですが、CardEntityはScriptの中に作るのであっていますよね?
    フォルダの名前等確認したのですが、やはりCreateCardEntityは出てきません。
    あと、CardEntityの5行目、fileName =CardE「i」ntityになってませんか?

    • みじんこ より:

      >トキムネさん

      >CardEntityはScriptの中に作るのであっていますよね?
      あってはいますが、メニューに「CreateCardEntity」が出てくるかどうかとは関係無いですね。。

      >あと、CardEntityの5行目、fileName =CardE「i」ntityになってませんか?
      これに関してはそうですね。間違ってます。笑
      ただこれは「CreateCardEntity」を押した時に作られるファイル名なので、今回の事象とは関係無さそうなので黙ってました。
      気になるようでしたら直してしまって大丈夫です!記事の方も後で直しておきます!

      とりあえず色々やってはみましたが、ちょっと分からないです。。すみません、、
      一応やったことは記事にまとめたので参考に見てみてください→ http://yuus01.info/game-make/no-createcardentity/

      あとは「ScriptableObject 作り方」って調べてみて下さい、、なにか参考になることが見つかるかも知れないです!

  5. もっけ より:

    今回から動きが出てきてカードゲームっぽくなり
    すごく面白く感じました!
    プログラムも細かいところは省いて
    教えすぎていないのですごく分かりやすいです!

    • みじんこ より:

      >もっけさん
      Unity始めてから3日目(?)でめちゃめちゃ進んでますね、、!笑(゚Д゚)スゴイ
      まさに「何も知らない初心者の方にもカードゲームが作れるように!」って思いながら書いている記事なので、実際の感想が聞けてありがたいです。

      多少内容としては難しくなっていきますが、「とりあえずよく分かんないけど作った(‘ω’)」でも十分力になるので、変に止まらないでガリガリ進めていって下さい!

  6. yuki より:

    お世話になっております。

    コードの作成&記入で

    GameManager に

    CardController card = Instantiate(cardPrefab, playerHand);

    とありますが、Instantiateの戻り値はGameObjectですのでコンパイルエラーになるのではないでしょうか?

    するならば

    CardController card = Instantiate(cardPrefab, playerHand).GetComponent();

    GameObject obj = Instantiate(cardPrefab, playerHand);
    CardController card = obj.GetComponent();

    となると思うのですが、いかがでしょうか?

    • みじんこ より:

      >yukiさん
      コメントありがとうございます。
      いえ、コンパイルエラーにはならないですよ!
      Instantiateは生成元のオブジェクトと同じ型を返すので!

      なので逆に、
      GameObject obj = Instantiate(cardPrefab, playerHand);
      とした場合は、
      「cardPrefabはCardController型なのでGameObject形に変換できません。」
      といったエラーが出るはずです。

      ※CardController card = Instantiate(cardPrefab, playerHand).GetComponent(); の方なら大丈夫です!

      あくまで「こっちの方がシンプルで分かりやすいかな」と思ってこう書いてるだけなので、
      yukiさん的にそっちの方が明示的で分かりやすいのあれば、そちらに書き直して頂いて全然いいですよ!

      ここ参考になると思います↓
      参考URL:https://teratail.com/questions/173027

  7. yuki より:

    ↑ ジェネリクスの <> がコメント投稿するときえてしまいますが、
    補っていただければと

  8. yuki より:

    みじんこさま
    回答ありがとうございます。

    InstantiateにGameObject以外を書けることを知らなかったというのもあるのですが、
    見直したところ、こちらでは
    > CardController cardPrefab;
    ではなく
    GameObject cardPrefab;
    と書いてしまっていたの原因でした。(カスタマイズしていたため)

    お手数をおかけいたしまして申し訳ないです。

    • みじんこ より:

      >yukiさん
      なるほど!だからエラーが出てたんですね!
      いえいえ、こちらも勉強になったので気にしないで下さい~

COMMENT

メールアドレスが公開されることはありません。