More than 3 years have passed since last update.

Unityで学ぶMVPパターン(2) ~ Viewコンポーネントを複数にする ~

Last updated at 2021-05-28Posted at 2018-09-23

前の記事　－　目次　－　次の記事
前回作ったUniRxで作成したMVPパターンを複数のViewコンポーネントを使えるようにする方法について考察

目的

体力(Health)の値に応じて以下の処理を反映したい。

体力バーを更新
テキスト形式で表示
体力が低くなると画面の上下に血痕（赤い画像）を表示する

これらをMVPパターンで実装します。

シーンの作成

以下の画像のようにシーンを作成します。

Githubに準備済みのプロジェクトを上げておきます。
02-UniRx-HealthBar-MultiView-Base

コンポーネントの作成

MVPパターンのViewにあたるコンポーネントを３種類作成します。
あと、Presenterコンポーネントを複数のViewを登録できるように改造します。

ParameterViewBase

作成するViewコンポーネントはこのクラスを継承させます。
virtualメソッドを作成して処理は空にします。

ParameterViewBase.cs

using UnityEngine;

public class ParameterViewBase : MonoBehaviour
{
    virtual public void SetParameter(int max, int value)
    {
    }
}

ParameterBar

以前作ったParameterBarコンポーネントを改造。

ParameterViewBaseを継承させ、
SetParameterメソッドはoverride修飾子をつけます。

ParameterBar.cs

using UnityEngine;

public class ParameterBar : ParameterViewBase
{
    public RectTransform valueRect;

    override public void SetParameter(int max, int value)
    {
        valueRect.localScale = new Vector3((float)value / max, 1, 1);
    }
}

ParameterText

体力の最大値と現在値をテキスト表示します。

ParameterText.cs

using UnityEngine.UI;

public class ParameterText : ParameterViewBase
{
    public Text valueText;

    override public void SetParameter(int max, int value)
    {
        valueText.text = value + " / " + max;
    }
}

ParameterImage

画面上下のImage画像パネルにアルファ値を設定します。
体力が低くなると赤いイメージ画像が表示するようになります。

ParameterText.cs

using UnityEngine;
using UnityEngine.UI;

public class ParameterImage : ParameterViewBase
{
    public Image valueImage;

    override public void SetParameter(int max, int value)
    {
        var color = valueImage.color;
        valueImage.color = new Color(color.r, color.g, color.b, Mathf.Lerp(1, 0, (float)value / max));
    }
}

ParameterPresenter

以前作ったParameterPresenterクラスのview変数を配列に変更。

ParameterViewBase[] 変数配列は
ParameterViewBaseを継承したクラスを登録することができます。

Awakeメソッドにて登録したクラスのSetParameterメソッドは
UniRxによりHealth値の変更時に実行されるようになります。

ParameterPresenter.cs

using UnityEngine;
using UniRx;

public class ParameterPresenter : MonoBehaviour {

    public StatusModel model;

    public ParameterViewBase[] healthViews;

    void Awake()
    {
        foreach (var view in healthViews)
        {
            model.healthRP.Subscribe(value => { view.SetParameter(model.healthMax, value); });
        }
    }
}