カードゲームの作り方

【Unity カードゲーム】オンライン対戦機能の実装方法解説⑥ PUN2の導入とマッチング機能実装編【解説通りに作るだけ】

こんにちは、みじんこと申します。

本記事では前記事から引き続き、Unityでのオンライン対戦機能の実装方法を説明します。

そちらをまだ見ていない方は、実施後にこの記事に進んで頂けると良きかと思います!

【注意事項】
前回の記事にリーダーへの攻撃処理実装」の内容を後から追記しました。
そちらについて実装してない方は、一旦実装してから本記事に戻ってきてくださいな!

本記事では下記の流れにて、カードゲームにおけるオンライン対戦機能の実装方法を解説していきます。

※本記事では⑥の「PUN2の導入とマッチング機能の実装」のみ解説していきます。

  1. 前準備とカードの作成
  2. UIの作成、カードの生成実装
  3. カードの種類の実装
  4. カードの移動とドロップ処理の実装
  5. カードバトル処理の実装
  6. カードの攻撃処理の実装
  7. PUN2の導入とマッチング機能の実装

本記事の完成形としてはこんな感じですね。

オンライン対戦のために必要な「PUN2」を導入して、マッチングするところまでやっていきます!

ついにオンライン化のところに入っていきますので、気合入れてやっていきましょう!!

みじんこ

今回も張り切っていこう!!

【実装概要】本記事で実装する内容について

さて今回のPUN2の導入とマッチング機能の実装は、こんな流れにて実装していきます!

  1. PUN2の導入
  2. マッチング機能実装(挙動確認)
  3. マッチング機能実装(2人でのマッチング)

まずはオンライン対戦の肝になる「PUN2」をゲームに導入して、

そのあと実際にマッチングするところまでやっていきます!!

みじんこ

今までとはちょっと違う感じの実装になりますが、
全部説明しながらやるので一緒に進めていきましょう!

手順①:PUN2の導入

さてまずは、今回のオンライン対戦機能の実装の肝になる「PUN2」の導入をやっていきましょう!!

ただ

分からん人

そもそもPUN2って何なのよ!!!!

って方もいるかと思うので、ちょいと説明しますと、、、

【コラム】PUN2って何なのよ??

「PUN2」とは、
Photon Unity Networking 2の略で、
Unityに簡単にオンラインの機能を実装出来ちゃうよ!!ってサービスです。

20CCU(CCU:同時接続してるユーザ数)までは無料で使えるので、ご安心を!

みじんこ

読み方はよくわからん笑
有識者は教えてください(゚ω゚)
(多分「ぱんつー」か、「ぷんつー」)

そんでそのPUN2の導入の流れが下記になります!!

  1. Photonの登録
  2. アプリケーションの作成
  3. PUN2のインポートとセットアップ

まあパっと見「??」って感じだと思いますが、一緒にやっていきましょう。

みじんこ

そんなに難しくはないよ!

【参考にさせて頂いたサイト】
PUN2(Photon Unity Networking 2)で始めるオンラインゲーム開発入門

今回の内容は基本的にこちらの内容を参考にさせていただいております。
「PUN2について、より詳細を知りたい!!」って場合はこちらを参照すること推奨です!

1-1.Photonのアカウント登録

まずは下記のPhotonの公式サイトにてアカウントの登録をしましょう。

https://www.photonengine.com/ja-JP/PUN

※アカウントがない場合は新規作成、ある場合はログインしてくださいな!!

みじんこ

単にアカウント登録とログインだけだから
詰まることはないと思うけど、
もし不明点、分かりづらい箇所があったらコメントください!

1-2.アプリケーションの作成

ログイン出来たら、
右上の「ダッシュボード」をクリックすると下記の画面になるはず。

この画面にて「新しいアプリを作成する」ボタンを押しましょう。

そしたら下記の画面が出てくるので、

  1. 「Pun」を選択
  2. 名前を入力(何でもいいよ)
  3. 作成するをクリック!!

作成出来たら、ダッシュボードにこんな感じの項目が出来るはず!!

AppIDはあとで使うので、メモっといてくださいな。

1-3.PUN2のインポート

お次はPUN2をUnityで使うためのアセットをインポートしていきましょう!!

下記のサイトのアセットをインポートしましょう。

https://assetstore.unity.com/packages/tools/network/pun-2-free-119922

Unityへのインポートもこんな感じにやりまして、、、

  1. PUN2を選択
  2. インポートをクリック

クリックしたら下記のウィンドウが出てくるので、インポートをクリック

インポートし終わると、下記のウィンドウが出てくるので
記載通りにセットアップしましょう。

  1. さっきコピーしたAppIDを貼り付ける
  2. Setup Projectをクリック
  3. こんな感じに「うまく行ったよ!」的なことが表示されたら、OKなので閉じる。

無事にセットアップが完了すると、Unity側で下記の表示が出ているはずなので、

画像通りに設定しちゃいましょう。

※「上記の設定が出て来ないんですが??」って方は、下記フォルダを漁れば出てくるのでご安心を!

ここまで設定出来たら、ひとまずPUN2の導入とセットアップは完了です!!

慣れないところもあったかと思いますが、お疲れ様でした!

みじんこ

不明点があったらコメントで教えてね!

手順②:マッチング機能の実装(挙動確認)

それでは次はついに、「オンラインマッチング機能」を実装していきます!

とはいえやることは、

マッチング管理をしてくれる「OnlineMatchingManager」スクリプトを新規で作って、
Unity側でちょいと設定をする!!

という感じですね。

みじんこ

早速やっていこう!

2-1.コードの作成と記載

ではまずオンラインのマッチング管理をする「OnlineMatchingManager」を作りたいので、

「OnlineMatchingManager」スクリプトを新規で作成しましょう。

作成出来たら、下記コードの丸ごとコピペしちゃってください!!

正直、パっと見だと、

訳分からん人

何じゃこりゃああ!!!

って思うかと思いますが、やってる処理の流れはこんな感じ!!

ざっくりとしてはこんな感じですが、

「もっと詳しく知りたい!!」という方は下記サイトを参照推奨!

【参考サイト】
PUN2(Photon Unity Networking 2)で始めるオンラインゲーム開発入門

https://zenn.dev/o8que/books/bdcb9af27bdd7d/viewer/c04ad5
https://zenn.dev/o8que/books/bdcb9af27bdd7d/viewer/3305df

そしたらマッチングが成功した後に「StartGame」メソッドが実行されて欲しいので、

GameManagerスクリプトのStartGameメソッドをパブリック化して、
Startメソッドからはコメントアウトしちゃいましょう!

GameManagerのコードをハイライト部分を修正しましょう。

これでコードの修正はOK!!

2-2.Unity側の設定

それではコードだけ作っても動かないので、

「OnlineMatchingManager」をヒエラルキー内に作成しましょう。

  1. Create Emptyで新しくオブジェクトを作る
  2. ①で作ったオブジェクトの名前を「OnlineMatchingManager」に変更
  3. AddComponentで「OnlineMatchingManager」をアタッチ

次は新しくマッチングボタンを作って、ボタンを押したらマッチングするように設定していきましょう。

  1. 「MatchingButton」を新規作成(TurnEndボタンをコピペすると良きだよ)
  2. 場所はこんな感じ
  3. テキストを「Matching」に変更
  4. OnlineMatchingManagerをアタッチ
  5. 「OnlineMatchingManager」の「OnMatchingButton」を選択

これで準備は完了!!

2-3.ゲームの実行

それではゲームを実行していきましょう!

ゲームを実行してもカードが生成されなくて、、、

マッチングボタンを押してマッチング成功したら、手札にカードが生成された!!

となればOKです!

手順③:マッチング機能の実装(2人でのマッチング)

さて「マッチング成功したね!!」とは言いましたが、

疑う人

一人だとマッチングしてる感が無いのだが、、??

ってひとも多いと思うので、2人でマッチングするようにしていきましょう!!

3-1.コードの修正

さてまずは、今のままだと1人でマッチングしてしまうので、

2人でマッチングするようにコードを修正していきましょう。

変更した箇所は「MaxPlayers」の値を2にした。ってだけですね。

この絵で言うと、

④の「自分で作る部屋」部屋に入れる設定人数を1人だったのを2人にしたよ!

ということです!

コードの設定はこれだけなので、次に進みましょう。

3-2.別ウィンドウでのゲーム起動設定とゲーム実行

では早速ゲームを実行していこうと思うのですが、

今作っているゲームに2人のプレイヤーのログインが必要なので、

別ウィンドウでゲームを実行させて、そのプレイヤーとマッチングするようにしていきましょう。

  1. Fileを選択
  2. Build Settingsをクリック
  3. PlayerSettingsをクリック
  4. 設定をこんな感じに変更
  5. Build And Runをクリック!!

そしたら多分こんな感じのが出てくると思うので、名前を適当に付けて、保存!!

そしたら別ウィンドウでこんなふうにゲームが立ち上がる!!

立ち上がったらすかさず「Matchingボタン」を押して、マッチング待ちの状態にしましょう。

そして間髪入れずにUnityの方でもゲームを実行して、「Matchingボタン」を押下!!

マッチングが成功した瞬間に、お互いの手札にカードが生成された!!!

ってなればOKです。

これでオンラインマッチングは実装完了!!

というわけで今回の実装はここまで。

新しいことがいっぱいありましたが、最後までお疲れ様でした( ´∀`)

【終わりに】オンラインマッチング機能の実装

今回も最後までお疲れ様でした!!!

ついにオンライン機能の実装に入りましたね。

次からはもっと実践的にカードゲームにオンライン機能を組み込んでいくよ!

具体的にはこんな風に、
カードを出したり、ドローした時や、攻撃した時にも連携出来るようにして、
オンライン対戦機能を完成させていきます!

次回以降の記事は購入者限定になってしまいますが、

作りたい人

こんなオンライン対戦のカードゲームが作りたい!!!

って方のお力になれるかと思うので、ぜひぜひご検討くださいな!

みじんこ

オンライン機能実装シリーズの最後まで、
読んでいただきありがとうございました!!

次は【応用編】の記事でお会いしましょう( ´∀`)

【次の記事】

執筆中!!!(6/18頃 投稿予定! →ごめん無理でした、、_:(´ཀ`」 ∠): 6/24週にはリリースします!

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

POSTED COMMENT

  1. えん より:

    非常にわかりやすい記事をありがとうございます。あまりUnityのことがわからなくてもこの記事まで進められました。
    本当に助かってます!

    1
  2. かまくら より:

    プログラムを始めたばかりでぼんやりカードゲーム作りたいなぁと思っていたところ,このサイトを見つけました.説明が非常にわかりやすく,とてもスラスラ進めることができました.本当にありがとうございます!
    この続きの解説が有料だとしても,とても読みたいなぁと思っているので待ってます!

    1
  3. 匿名 より:

    一ヶ月ほど前にこのブログを見つけて、「カードゲームの作り方」シリーズの一番はじめの記事を読み始めてようやく追いつきました。とても役に立ちましたありがとうございます。

    1
  4. 匿名 より:

    とても勉強になります。
    続きお待ちしております。

    1
    • みじんこ より:

      コメントありがとうございます!!
      このところ立て込んでまして、、(´;ω;`)
      年内には更新出来るように考えております!!

      1

COMMENT

メールアドレスが公開されることはありません。 が付いている欄は必須項目です