DevExpress开辟WPF应用实现对话框总结

说明：

• 完整代码Github​（https://github.com/VinciYan/DXMessageBoxDemos.git）
  
• DevExpree v23.2.4（链接：https://pan.baidu.com/s/1eGWwCKAr8lJ_PBWZ_R6SkQ?pwd=9jwc 提取码：9jwc）
  
• 使用Visual Studio Community 2022
  

简单标准弹窗

使用标准的.NET的MessageBox：

1. public void BaseMsg()
2. {
3.     MessageBox.Show("This is a standard .NET MessageBox", "Title", MessageBoxButton.OK, MessageBoxImage.Information);
4. }

复制代码

DevExpress的DXMessageBox

1. public void DxBaseMsg()
2. {
3.     // 显示一个简单的消息框
4.     DXMessageBox.Show("This is a DevExpress DXMessageBox", "Title", MessageBoxButton.OK, MessageBoxImage.Information);
5. }

复制代码

DevExpress的IMessageBoxService

在DevExpress WPF中使用IMessageBoxService来显示一个消息框，并根据用户的选择更新按钮的文本，符合MVVM模式的设计原则，保持了视图和视图模型的分离

1. <Window ...
2.         xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
3.         xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
4.         DataContext="{dxmvvm:ViewModelSource Type=local:ViewModel}">
5.     <dxmvvm:Interaction.Behaviors>
6.         <dx:DXMessageBoxService/>
7.     </dxmvvm:Interaction.Behaviors>
9.     <dx:SimpleButton Content="{Binding ButtonText}"
10.                      Command="{Binding SaveConfirmationCommand}"/>
11. </Window>

复制代码

1. public class ViewModel : ViewModelBase {
2.     public virtual string ButtonText { get; set; } = "Save Changes Button";
4.     IMessageBoxService MessageBoxService { get { return GetService<IMessageBoxService>(); } }
6.     [Command]
7.     public void SaveConfirmation() {
8.         MessageResult result;
9.         result = MessageBoxService.ShowMessage(
10.             messageBoxText: "Save Changes?",
11.             caption: "DXApplication",
12.             icon: MessageIcon.Question,
13.             button: MessageButton.YesNoCancel,
14.             defaultResult: MessageResult.Cancel
15.         );
16.         switch (result) {
17.             case MessageResult.Yes:
18.                 ButtonText = "Changes Saved";
19.                 break;
20.             case MessageResult.No:
21.                 ButtonText = "Changes Discarded";
22.                 break;
23.             case MessageResult.Cancel:
24.                 ButtonText = "Continue Editing";
25.                 break;
26.         }
27.     }
28. }

复制代码

点击“Yes”按钮，修改按钮显示的文字为“Changes Saved”

DevExpress的DXDialog

DXDialog提供了比标准WPF对话框更强大的功能和更高的机动性。它在定制、样式支持、MVVM集成、功能丰富性和一致的用户体验方面体现出色
DXDialog提供了丰富的功能，比如：

• 定位：可以轻松控制对话框在屏幕上的位置
  
• 巨细：可以设置对话框的宽度和高度
  
• 内容：可以将恣意WPF控件添加到对话框中，支持复杂的内容布局
  

简单控件

1. public void BaseDXDialog()
2. {
3.     var dialog = new DXDialog
4.     {
5.         WindowStartupLocation = WindowStartupLocation.CenterScreen,
6.         Width = 500,
7.         Height = 300,
8.         Title = "Custom Dialog",
9.         Content = new TextBlock { Text = "This is a custom DXDialog", Margin = new Thickness(10) }
10.     };
12.     var result = dialog.ShowDialog();
13.     if (result == true)
14.     {
15.         MessageBox.Show("OK clicked");
16.     }
17.     else
18.     {
19.         MessageBox.Show("Cancel clicked");
20.     }
21. }

复制代码

复杂控件

1. public void CompDXDialog()
2. {
3.     // 创建一个 StackPanel 作为对话框的内容
4.     var stackPanel = new StackPanel
5.     {
6.         Margin = new Thickness(10)
7.     };
9.     // 在 StackPanel 中添加控件
10.     stackPanel.Children.Add(new TextBlock { Text = "Enter your name:", Margin = new Thickness(0, 0, 0, 10) });
11.     var nameTextBox = new TextBox { Width = 200, Margin = new Thickness(0, 0, 0, 10) };
12.     stackPanel.Children.Add(nameTextBox);
13.     stackPanel.Children.Add(new TextBlock { Text = "Select your age:", Margin = new Thickness(0, 0, 0, 10) });
14.     var ageComboBox = new ComboBox { Width = 200, Margin = new Thickness(0, 0, 0, 10) };
15.     ageComboBox.ItemsSource = new int[] { 18, 19, 20, 21, 22, 23, 24, 25 };
16.     stackPanel.Children.Add(ageComboBox);
18.     // 设置 StackPanel 作为对话框的内容
19.     var dialog = new DXDialog
20.     {
21.         WindowStartupLocation = WindowStartupLocation.CenterScreen,
22.         Title = "Custom Dialog with Controls",
23.         Content = stackPanel
24. };
26.     // 显示对话框并获取结果
27.     var result = dialog.ShowDialog();
29.     // 根据对话框结果进行处理
30.     if (result == true)
31.     {
32.         string name = nameTextBox.Text;
33.         int? age = ageComboBox.SelectedItem as int?;
34.         MessageBox.Show($"Name: {name}, Age: {age}");
35.     }
36.     else
37.     {
38.         MessageBox.Show("Dialog was cancelled.");
39.     }
40. }

复制代码

自定义控件

可以将一个View页面（例如一个用户控件）放置在DXDialog的Content属性中。这样可以使对话框的内容更加复杂和模块化，从而更好地构造和管理代码
以下是一个示例，展示如安在DXDialog中放置一个用户控件：

1. public void UserControlDXDialog()
2. {
3.     // 创建并设置用户控件作为对话框的内容
4.     var myUserControl = new MyUserControl();         
5.     var dialog = new DXDialog
6.     {
7.         WindowStartupLocation = WindowStartupLocation.CenterScreen,
8.         Title = "Custom Dialog with UserControl",
9.         Content = myUserControl
10.     };         
12.     // 显示对话框并获取结果
13.     var result = dialog.ShowDialog();
15.     // 根据对话框结果进行处理
16.     if (result == true)
17.     {
18.         string name = myUserControl.UserName;
19.         int? age = myUserControl.UserAge;
20.         MessageBox.Show($"Name: {name}, Age: {age}");
21.     }
22.     else
23.     {
24.         MessageBox.Show("Dialog was cancelled.");
25.     }
26. }

复制代码

DevExpress的IDialogService

自定义对话框按钮

SimpleDialogView.xaml

1. <UserControl x:Class="DXMessageBoxDemos.View.SimpleDialogView"
2.              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3.              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4.              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
5.              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
6.              xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
7.              xmlns:local="clr-namespace:DXMessageBoxDemos.View"
8.              xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
9.              mc:Ignorable="d"
10.              d:DesignHeight="450" d:DesignWidth="800">
11.     <dxmvvm:Interaction.Behaviors>
12.         <dx:CurrentDialogService />
13.     </dxmvvm:Interaction.Behaviors>
15.     <StackPanel>
16.         <ComboBox SelectedItem="{Binding DialogResult}">
17.             <ComboBox.Items>
18.                 <dxmvvm:MessageResult>Yes</dxmvvm:MessageResult>
19.                 <dxmvvm:MessageResult>No</dxmvvm:MessageResult>
20.                 <dxmvvm:MessageResult>Cancel</dxmvvm:MessageResult>
21.             </ComboBox.Items>
22.         </ComboBox>
23.         <Button Command="{Binding CloseCommand}" Content="Close the dialog from the dialog view model" />
24.     </StackPanel>
25. </UserControl>

复制代码

SimpleDialogViewModel.cs

1. public class SimpleDialogViewModel : ViewModelBase
2. {
3.     public MessageResult DialogResult
4.     {
5.         get { return GetProperty(() => DialogResult); }
6.         set { SetProperty(() => DialogResult, value); }
7.     }
8.     protected ICurrentDialogService CurrentDialogService { get { return GetService<ICurrentDialogService>(); } }
10.     [Command]
11.     public void Close()
12.     {
13.         CurrentDialogService.Close(DialogResult);
14.     }
15. }

复制代码

MainViewModel.cs

1. public MessageResult Result
2. {
3.     get { return GetProperty(() => Result); }
4.     set { SetProperty(() => Result, value); }
5. }
6. protected IDialogService DialogService { get { return GetService<IDialogService>(); } }
8. [Command]
9. public void ShowDialog()
10. {
11.     Result = DialogService.ShowDialog(dialogButtons: MessageButton.YesNoCancel, title: "Simple Dialog", viewModel: new SimpleDialogViewModel());
12. }

复制代码

MainView.xaml

1. <StackPanel>
2.     <TextBlock Text="DialogService:"/>
3.     <Button Command="{Binding ShowDialogCommand}" Content="Show Dialog" />
4.     <TextBlock Text="{Binding Result, StringFormat='The last result is {0}'}" />
5. </StackPanel>

复制代码

异步按钮

DialogService可以显示异步按钮。这些按钮指示关联的异步操作是否正在举行

1. public void ShowRegistrationForm()
2. {
3.     UICommand registerAsyncCommand = new UICommand(
4.        id: null,
5.        caption: "Register Async",
6.        command: new AsyncCommand<CancelEventArgs>(
7.            async cancelArgs => {
8.                try
9.                {
10.                    await MyAsyncExecuteMethod();
11.                }
12.                catch (Exception e)
13.                {
14.                    AsyncMessageBoxService.ShowMessage(e.Message, "Error", MessageButton.OK);
15.                    cancelArgs.Cancel = true;
16.                }
17.            },
18.            cancelArgs => !string.IsNullOrEmpty(registrationViewModel.UserName)
19.        ),
20.        asyncDisplayMode: AsyncDisplayMode.Wait,
21.        isDefault: false,
22.        isCancel: false
23.    );
25.     UICommand registerCommand = new UICommand(
26.         id: null,
27.         caption: "Register",
28.         command: new DelegateCommand<CancelEventArgs>(
29.             cancelArgs => {
30.                 try
31.                 {
32.                     MyExecuteMethod();
33.                 }
34.                 catch (Exception e)
35.                 {
36.                     AsyncMessageBoxService.ShowMessage(e.Message, "Error", MessageButton.OK);
37.                     cancelArgs.Cancel = true;
38.                 }
39.             },
40.             cancelArgs => !string.IsNullOrEmpty(registrationViewModel.UserName) && !((IAsyncCommand)registerAsyncCommand.Command).IsExecuting
41.         ),
42.         isDefault: true,
43.         isCancel: false
44.     );
46.     UICommand cancelCommand = new UICommand(
47.         id: MessageBoxResult.Cancel,
48.         caption: "Cancel",
49.         command: null,
50.         isDefault: false,
51.         isCancel: true
52.     );
54.     UICommand result = AsyncDialogService.ShowDialog(
55.         dialogCommands: new List<UICommand>() { registerAsyncCommand, registerCommand, cancelCommand },
56.         title: "Registration Dialog",
57.         viewModel: registrationViewModel
58.     );
60.     if (result == registerCommand)
61.     {
62.         // ...
63.     }
64. }
66. void MyExecuteMethod()
67. {
68.     // ...
69. }
71. async Task MyAsyncExecuteMethod()
72. {
73.     await Task.Delay(2000);
74.     // ...
75. }

复制代码

点击“Register Async”，实行异步方法

参考

• DialogService | WPF Controls | DevExpress Documentation
  
• Showing Dialogs When Using the MVVM Pattern in WPF or UWP - CodeProject
  
• 如安在 WPF/MVVM 中将参数传递给对话框 | DevExpress 支持 — How to pass param to dialog in WPF/MVVM | DevExpress Support
  
• Implementing Dialog Boxes in MVVM - CodeProject
  
• 对话服务 | WPF 控件 | DevExpress 文档 — DialogService | WPF Controls | DevExpress Documentation
  
• DX消息框服务| WPF 控件 | DevExpress 文档 — DXMessageBoxService | WPF Controls | DevExpress Documentation
  

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。