Unityに関連する記事です

 以下の内容で順番に実装を進めていきます。

手順11 ーMVP パターンによるリザルト表示の実装ー
17.MVP パターンの学習



 新しい学習内容は、以下の通りです。

 ・UniRx の ReactiveProperty の活用
 ・MVP パターンによるリファクタリング



17.MVP パターンの学習

1.設計


 Unity において UI を表示する際には uGUI の機能を活用し、Canvas 内に Text コンポーネントなどを配置することで実装を行います。
UI の表示と更新については、Web 関係で活用されている MVP (Model、View、Presenter)パターンという設計方法を用いた設計を行うことが出来ます。

 こちらの機能を実装するためには、UniRx というアセットを利用します。まずはそちらをインポートしてから学習していきます。
 

2.UniRx のインストール


 無償で提供されているライブラリを利用します。

 Unity のアセットストアの検索にて UniRx と入力すると検索結果として表示されますので、そちらをダウンロードして Unity にインポートします。
あるいは下記のリンクから直接参照も出来ます。
UniRx
https://assetstore.unity.com/packages/tools/integr...


アセットストア




3.<UniRx とは?>


 UniRx とはリアクティブプログラミングという考え方を Unity で利用できるように設計されているライブラリです。
非同期処理イベント処理に対して効率的な実装方法を提供する構造になっています。(Rx はリアクティブ・エクステンションの略号です。)

 便利かつ、高度な処理を実現することができますが、学習コストも非常に高いものになっています。
また学習したからといって、なんでもこの構造にすればいい、というものでもありません

 今回はその中でも比較的扱いやすく、利用する機会の多い機能について、数回に分けて実装を行いながら学習を行っていきます。

 C# の基礎だけではなく、Linq、ラムダ式(および、メソッドチェーン)といった機能も理解していないと扱うことが難しいため、
これらの機能についてまだ理解が不十分である場合には、そちらを学習してから進めるようにしてください。

 UniRx については記事も多いですし、参考となる書籍もありますので、そちらも合わせて学習を行うようにしてください。

 スクリプト内で UniRx を利用する場合、using UniRx; の宣言が必要になります。


4.<オブザーバーデザインパターンを利用した設計>


 UniRx はデザインパターンの1つである、オブザーバーデザインパターンというもので設計されています。

 具体的には、イベント(ボタンなど)を実行した際の処理を、通知する側通知を受け取る側、という概念を利用して実装を行う設計になります。

 なお、下記のサイトに非常に丁寧な考え方が書いてあります。
こちらを読んでいただいた上で、今後の手順は設計と実装を行います。

 まだ難しい内容であると感じた場合には、これ以降の手順は難しいため、より理解を深めてから再度挑戦するようにしてください。


参考サイト
Qiita @toRisouP 様
【Unity】Model-View-(Reactive)Presenterパターンとは何なのか
https://qiita.com/toRisouP/items/5365936fc14c7e7ea...



 以下が、今回の機能を実装していく際に作成するクラスになります。

 ・Result_View
 ・Result_Model
 ・Presenter

 ・MainGame

 View クラスとしてリザルト表示を行う機能をまとめます。

 Model クラスにはリザルト表示に利用する変数の情報を UniRx の ReactiveProperty を利用してまとめます。

 Presenter クラスはこの2つの情報を結び付けるため、Model クラスにある ReactiveProperty の購読を行い、View クラス側に通知します。

 MainGame クラスは、UI 表示以外の、ゲームの実処理をまとめたクラスです。
いままである GameManager クラスと同じ役割になります(同じ名前で修正すると分かりにくくなるため、新しいクラスとして作成しています)


5.Result_View スクリプトを作成する


 View(表示更新)にかかわる部分のクラスを作成します。
このクラスでは UI の表示更新のみを行うため、今回は Text コンポーネントの制御命令のみ記述しています。


Result_View.cs

<= クリックすると開きます。



6.Result_Model スクリプトを作成する


 つづいて Model クラスを作成します。
こちらでは UniRx の機能の1つである ReactiveProperty を活用し、オブザーバーパターンを利用した設計を行っています。

 プレイヤーの勝利数のカウントを行うための WinCount 変数を ReactiveProperty<int> を作成し、こちらの監視(購読)を Presenter で行います。
おなじく、結果表示用の ResultMessage 変数も ReactiveProperty<string> を作成し、同じように Presenter にて購読します。


Result_Model.cs

<= クリックすると開きます。



7.MainGame スクリプトを作成する


 GameManager スクリプトを元に、MVP パターンでの設計に対応したメイン処理を行うスクリプトを作成します。
このクラスはゲーム内の実処理を記述します。最初にも書いたように、すべての処理を MVP パターンに当てはめる必要はありません
今回であれば、あくまでも UI 表示に関連する機能のみを切り離して設計しているだけです。

 新しいスキルの習得をしたとき、それだけに盲目的に頼ることはよくありません。
視野を広くもって、自分のスキルの引き出しを広げるつもりで取り組むとよいでしょう。


 ShowResult メソッドがなくなって代わりの GameUp メソッドが追加されたり、変数の宣言に ReactiveProperty が利用されています。
また、いままでは Start メソッドより InitialSettings メソッドを実行していましたが、こちらも外部のクラスより実行する設計に変更になっています。


MainGame.cs

<= クリックすると開きます。



8.Presenter スクリプトを作成する

Model と View の仲介役となる Presenter を作成します。
双方の情報を管理しているのはこの Presenter のみとなりますので、
Model 側は View を知りませんし、View 側も Model を知りません。

 このように設計することで、両クラス間の状態を疎結合に保つことが出来ます。


Presenter.cs

<= クリックすると開きます。



9.View 用のゲームオブジェクトに Result_View スクリプトをアタッチする


 View についても新しいゲームオブジェクトを作成してアタッチしてもよいですが、
すでに Canvas 内に View 用のゲームオブジェクトがあると思いますので、そちらにアタッチして、名前も 〜 View に変更しておきます。
できればフォルダ役のゲームオブジェクトを作り、その中に Text などを格納して管理するようにしてください。


ヒエラルキー画像



Player_View ゲームオブジェクト



Opponnet_View ゲームオブジェクト



 以上で設定は完了です。


10.Presenter と Model のゲームオブジェクトを作成する


 各クラスの役割をわかりやすく管理するため、今回は既存のゲームオブジェクトにアタッチする形ではなく、
各 Model や Presenter ごとにゲームオブジェクトを作成して、それぞれのクラスをアタッチしています。


ヒエラルキー画像



MVP_Set(フォルダ役) ゲームオブジェクト



Presenter ゲームオブジェクト



MainGame ゲームオブジェクト



Player_Model ゲームオブジェクト



Opponent_Model ゲームオブジェクト


 以上で設定は完了です。


11.ゲームを実行して動作を確認する


 設計自体が変わり、処理の記述は MVP パターンになりましたが、あくまでもリファクタリングになりますので、ゲームの内容自体は変わりません。
よって、今までと同じようにゲームが遊べるようになっているかを確認してください。



 以上でこの手順は終了です。

 次は 手順12 −MVP パターンによるインフォ表示の実装− です。

コメントをかく


「http://」を含む投稿は禁止されています。

利用規約をご確認のうえご記入下さい

Menu



プログラムの基礎学習

コード練習

技術/知識(実装例)

2Dおはじきゲーム(発展編)

2D強制横スクロールアクション(発展編)

3Dダイビングアクション(発展編)

2Dタップシューティング(拡張編)

レースゲーム(抜粋)

2D放置ゲーム(発展編)

3D脱出ゲーム(抜粋)

2Dリアルタイムストラテジー

2Dトップビューアドベンチャー(宴アセット使用)

3Dタップアクション(NavMeshAgent 使用)

2Dトップビューアクション(カエルの為に〜、ボコスカウォーズ風)

3Dトップビューアクション(白猫風)

VideoPlayer イベント連動の実装例

VideoPlayer リスト内からムービー再生の実装例(発展)

AR 画像付きオブジェクト生成の実装例

AR リスト内から生成の実装例(発展)

private



このサイト内の作品はユニティちゃんライセンス条項の元に提供されています。

管理人/副管理人のみ編集できます