Prism の Module でダイアログを表示する方法

ネットユーザーから、Prism の Module でダイアログを表示する方法について要望がありました。メイン画面で「バージョン情報」ダイアログを表示するのと同じようにするには？

ネットユーザーの要望

ダイアログウィンドウの表示効果：

効果は普通ですが、デザイナーがいれば美しくできます。

本記事は詳細には書きません。具体的な方法はソースコードを参照してください（文末にリポジトリリンクあり）。また、Prism の学習については以下の記事を参考にしてください：

NET Core 3.x WPF MVVM フレームワーク Prism シリーズ（後続バージョン共通）

https://dotnet9.com/album/wpf-prism

WPF エンタープライズ向け開発フレームワーク構築ガイド（啓示録）、2020 入門から放棄まで

https://jhrs.com/2020/37391.html

1 バージョン情報ダイアログはどのように表示されるのか？

1.1 汎用ダイアログウィンドウの登録

App.xaml.cs

protected override void RegisterTypes(IContainerRegistry containerRegistry)
{
  ...
  containerRegistry.RegisterDialogWindow<DialogWindow>();// カスタムダイアログウィンドウの登録
  ...
}

上記のコードでは、RegisterDialogWindow がダイアログウィンドウの登録処理です。つまり、表示されるすべてのダイアログは DialogWindow 内にラップされています。コードは簡単なので省略しますが、Window であることだけ理解しておけば十分です。詳細はソースコード：DialogWindow を参照してください。

1.2 実際のダイアログの登録

同じく App.xaml.cs ファイルで、以下のコードが実際のダイアログ（「QQグループダイアログ」「バージョン情報ダイアログ」「おすすめサイトダイアログ」など）を登録しています。括弧内の文字列（例："About"）はダイアログ表示時の識別に使用されます。注：実際のダイアログは UserControl をベースにしており、RegisterDialogWindow 内の Window に埋め込めるようになっています。

protected override void RegisterTypes(IContainerRegistry containerRegistry)
{
  ...
  containerRegistry.RegisterDialogWindow<DialogWindow>();// カスタムダイアログウィンドウの登録
  containerRegistry.RegisterDialog<QQGroupView, QQGroupViewModel>("QQGroup");
  containerRegistry.RegisterDialog<AboutView, AboutViewModel>("About");
  containerRegistry.RegisterDialog<WebView, WebViewModel>("Web");
  ...
}

1.3 メニューからダイアログを呼び出す

これも非常に簡単で、XAML で直接使用します。例えば、メインウィンドウの「バージョン情報」メニュー：

<menuitem
  Command="{Binding RaiseShowDialogCommand}"
  CommandParameter="About"
  Header="{markup:I18n {x:Static i18NResources:Language.About}}"
>
  <MenuItem.Icon>
    <Path
      Width="16"
      Data="{StaticResource InfoGeometry}"
      Fill="{DynamicResource SuccessBrush}"
    />
  </MenuItem.Icon>
</menuitem>

RaiseShowDialogCommand は VM の基底クラス ViewModelBase で定義されています。実際の呼び出しコードは以下の通りです：

/// <summary>
/// ダイアログを表示
/// </summary>
/// <param name="dlgName"></param>
private void RaiseShowDialogHandler(string dlgName)
{
  DialogService.ShowDialog(dlgName);
}

パラメータ dlgName は、上記の 1.2 でダイアログを登録した際に指定した文字列です。状況に応じて指定します。

2 Module 内のダイアログはどのように表示するのか？

この節が本記事の重点です。

2.1 キーポイント：IModule の RegisterTypes メソッド

Module は動的に読み込まれます。モジュール内のダイアログを App.xaml.cs に記述することはできません。Prism に詳しい方であれば、各モジュールの Module エントリクラス（IModule を実装したクラス）のメソッド RegisterTypes(IContainerRegistry containerRegistry) を知っているでしょう。ここで、モジュールで使用する型やダイアログを注入し、自モジュールや他のモジュールから利用できるようにします。

2.2 モジュールダイアログの実装

例として LQClass.ModuleOfLog モジュールを使用します。以下で、ログ追加ダイアログを登録します：

public void RegisterTypes(IContainerRegistry containerRegistry)
{
  ...
  containerRegistry.RegisterDialog<AddView, AddViewModel>("AddLogView");
  ...
}

AddView はログ追加ビューで、通常のユーザーコントロールと変わりません。バージョン情報ダイアログを参考に作成してください。本プロジェクトのビューリンク：AddView.xaml を参照。

2.3 どう呼び出すのか？

呼び出し方はメインウィンドウのメニューと同じです。コードファイルのパス：src\LQClass.AdminForWPF\Modules\LQClass.ModuleOfLog\Views 内の「追加」ボタンの宣言は以下の通り：

<Button
  Margin="10,15,10,0"
  Style="{StaticResource ButtonSuccess}"
  Command="{Binding RaiseShowDialogCommand}"
  CommandParameter="AddLogView"
  Content="{markup:I18n {x:Static i18NResources:Language.Add}}"/>

コマンドパラメータ AddLogView は、2.2 でビューを登録した際に指定した名前です。

効果は以下の通り。モジュール内でダイアログを表示する方法を示すだけで、実際の業務ロジックは含まれていません：

3 プロジェクトの実行方法について

説明：本プロジェクトのサーバーサイドは WTM で構築、クライアントは WPF で作成されています。

3.1 サーバーサイドの実行

クライアントの動作確認が必要な場合は、まずサーバーサイド src\LQClass.Admin をビルドしてください。ビルド方法がわからない場合は、各自で Google 検索してください。ビルド成功後、サーバーサイドプロジェクトをデバッグ実行するか、サーバーサイドの Exe をダブルクリックします：src\LQClass.Admin\LQClass.Admin\bin\Debug\net5.0\LQClass.Admin.exe。サーバーサイドはデフォルトでポート 5000 を使用します。

3.2 WPF クライアントの実行

ソースコードだけを見る場合は、この手順はスキップしてください。

App.config で、クライアントがサーバーサイドに接続するアドレスが正しいか確認してください：

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
	<appSettings>
    ...
		<add key="API" value="http://localhost:5000/api/"/>
	</appSettings>
  ...
</configuration>

プロジェクトパス：src\LQClass.AdminForWPF。ビルドに成功したら、クライアントプロジェクトをデバッグするか、クライアントの Exe をダブルクリックします：\src\LQClass.AdminForWPF\Build\LQClass.AdminForWPF.exe でクライアントを起動できます。

バックエンドのデフォルト管理者アカウント：

admin
000000

最後に完全なデモを：

リポジトリ（issue 歓迎）：https://github.com/dotnet9/lqclass.com