【図解】[WPF/C#] Prism 7.2で 画面遷移をする

Prism の画面遷移は、正直最初は分かりにくいですよね。

僕も最初のうちは分かりづらく、苦戦しました。

この記事では、Prismの入門者に向けて、 Prismアプリケーションで必須となる「画面遷移」について、図を交えてご紹介します。

Prism の画面遷移の概念について

実は"画面遷移"という言葉はやや適切な表現ではないかもしれません。

Prism は画面の一部分の領域(※Region)の表示を切り替わることで、画面遷移を実現しているためです。

※ Region とは

Prism は画面の一部を領域(Region)を定義することを Region と呼びます。 後述しますが、Prism では、この画面の領域(Region)に対して、"画面A"、"画面B"を表示することで画面遷移を実現しているのです。

分かりやすい画面構成の例を交えて紹介しましょう。

ヘッダーメニューエリアとコンテンツエリアがある画面

ヘッダー部分にメニューを配置しているレイアウト。

よくあるパターンかと思います。

上記のレイアウト構成を元に、Prismにおいて、"画面A"や"画面B"に遷移するシナリオをコードを交えてご紹介します。

"画面A"を選択した場合に、コンテンツエリアに"画面A”を表示する場合

public HeaderMenuAreaViewModel(IRegionManager regionManager)
{
    ...省略...
    
    // 画面Aが選択された場合
    this.OnClickedScreenACommand = new DelegateCommand(
    () =>
    {
        // コンテンツ Region に 画面A を表示します。
        regionManager.RequestNavigate("コンテンツ Region", "画面A");
    });
}

"画面B"を選択した場合に、コンテンツエリアに"画面B”を表示する場合

public HeaderMenuAreaViewModel(IRegionManager regionManager)
{
    ...省略...
    
    // 画面Bが選択された場合
    this.OnClickedScreenBCommand = new DelegateCommand(
    () =>
    {
        // コンテンツ Region に 画面B を表示します。
        regionManager.RequestNavigate("コンテンツ Region", "画面B");
    });
}

以上となります。

IRegionManager は Region を管理する Prism が標準で提供しているマネージャーですね。

上記のソースコードはコピペしてすぐに使えるので、お試しでご利用くださいませ。