有网友提出需求,在Prism的Module中如何弹出对话框?像主界面弹出关于对话框一样?

网友需求

关于窗口弹出效果:

效果一般,如果有设计师可以做的很漂亮。

本文不打算写的很详细,具体做法可以看源码(文末附仓库链接),另外关于Prism的学习可参考如下文章:

  1. NET Core 3.x WPF MVVM框架Prism系列(后续版本通用)
https://dotnet9.com/album/wpf-prism
  1. 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编写的,只有这样才能套入是一个WindowRegisterDialogWindow

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}}"/>

命令参数AddLogView2.2中注册视图时给的名称。

效果如下,只是演示模块中如何弹出对话框,未加实际业务:

3 关于项目怎么运行?

说明:本项目服务端基于WTM搭建,客户端由WPF编写。

3.1 运行服务端

如果需要运行查看客户端效果,请先编译服务端src\LQClass.Admin,至于怎么编译,不会的自行百度哦,编译成功后,调试运行服务端项目,或者双击运行服务端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