背水一战 Windows 10 (37)

jqkyp

　　[源码下载]




背水一战 Windows 10 (37) - 控件（弹出类）: MessageDialog, ContentDialog　　
作者：webabcd

介绍
背水一战 Windows 10 之 控件（弹出类）

• MessageDialog
  
• ContentDialog
  

　　
示例
1、MessageDialog 的示例
Controls/FlyoutControl/MessageDialogDemo.xaml



<Page
x:Class="Windows10.Controls.FlyoutControl.MessageDialogDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.FlyoutControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="Transparent">
<StackPanel Margin="10 0 10 10">
<TextBlock Name="lblMsg" Margin="5" />
<Button Name="btnShowMessageDialogSimple" Margin="5" Content="弹出一个简单的 MessageDialog" Click="btnShowMessageDialogSimple_Click" />
<Button Name="btnShowMessageDialogCustomCommand" Margin="5" Content="弹出一个自定义命令按钮的 MessageDialog" Click="btnShowMessageDialogCustomCommand_Click" />
</StackPanel>
</Grid>
</Page>
　　Controls/FlyoutControl/MessageDialogDemo.xaml.cs



/*
* MessageDialog - 信息对话框（未继承任何类）
*     Content - 内容
*     Title - 标题
*     Options - 选项（Windows.UI.Popups.MessageDialogOptions 枚举）
*         None - 正常，默认值
*         AcceptUserInputAfterDelay - 为避免用户误操作，弹出对话框后短时间内禁止单击命令按钮
*     Commands - 对话框的命令栏中的命令集合，返回 IList<IUICommand> 类型的数据
*     DefaultCommandIndex - 按“enter”键后，激发此索引位置的命令
*     CancelCommandIndex - 按“esc”键后，激发此索引位置的命令
*     ShowAsync() - 显示对话框，并返回用户激发的命令
*     
* IUICommand - 命令
*     Label - 显示的文字
*     Id - 参数
*/
using System;
using Windows.UI.Popups;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
namespace Windows10.Controls.FlyoutControl
{
public sealed partial class MessageDialogDemo : Page
{
public MessageDialogDemo()
{
this.InitializeComponent();
}
// 弹出一个简单的 MessageDialog
private async void btnShowMessageDialogSimple_Click(object sender, RoutedEventArgs e)
{
MessageDialog messageDialog = new MessageDialog("内容");
await messageDialog.ShowAsync();
}
// 弹出一个自定义命令按钮的 MessageDialog
private async void btnShowMessageDialogCustomCommand_Click(object sender, RoutedEventArgs e)
{
MessageDialog messageDialog = new MessageDialog("内容", "标题");
messageDialog.Commands.Add
(
new UICommand
(
"自定义命令按钮1",
(command) =>
{
lblMsg.Text = string.Format("command label:{0}, id:{1}", command.Label, command.Id);
},
"param1"
)
);
messageDialog.Commands.Add
(
new UICommand
(
"自定义命令按钮2",
(command) =>
{
lblMsg.Text = string.Format("command label:{0}, id:{1}", command.Label, command.Id);
},
"param2"
)
);
messageDialog.Commands.Add
(
new UICommand
(
"自定义命令按钮3",
(command) =>
{
lblMsg.Text = string.Format("command label:{0}, id:{1}", command.Label, command.Id);
},
"param3"
)
);
messageDialog.DefaultCommandIndex = 0; // 按“enter”键后，激发第 1 个命令
messageDialog.CancelCommandIndex = 2; // 按“esc”键后，激发第 3 个命令
messageDialog.Options = MessageDialogOptions.AcceptUserInputAfterDelay; // 对话框弹出后，短时间内禁止用户单击命令按钮，以防止用户的误操作
// 显示对话框，并返回用户激发的命令
IUICommand chosenCommand = await messageDialog.ShowAsync();
lblMsg.Text += Environment.NewLine;
lblMsg.Text += string.Format("result label:{0}, id:{1}", chosenCommand.Label, chosenCommand.Id);
}
}
}
　　
2、ContentDialog 的示例
Controls/FlyoutControl/CustomContentDialog.xaml



<ContentDialog
x:Class="Windows10.Controls.FlyoutControl.CustomContentDialog"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.FlyoutControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="custom dialog title"
PrimaryButtonText="primary button"  
SecondaryButtonText="secondary button"
PrimaryButtonClick="ContentDialog_PrimaryButtonClick"
SecondaryButtonClick="ContentDialog_SecondaryButtonClick">
<!--以下为自定义对话框的标题-->
<ContentDialog.TitleTemplate>
<DataTemplate>
<TextBlock Text="custom dialog title" Foreground="Red" />
</DataTemplate>
</ContentDialog.TitleTemplate>
<!--以下为自定义对话框的内容-->
<StackPanel VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<TextBox Name="email" Header="Email address"/>
<PasswordBox  Name="password" Header="Password"/>
<CheckBox Name="showPassword" Content="Show password"/>
<TextBlock Name="body" TextWrapping="Wrap">
<TextBlock.Text>
content content content content content content content content content content content content content content
</TextBlock.Text>
</TextBlock>
</StackPanel>
</ContentDialog>
　　Controls/FlyoutControl/CustomContentDialog.xaml.cs



/*
* 自定义 ContentDialog
*/
using System.Threading.Tasks;
using Windows.UI.Xaml.Controls;
namespace Windows10.Controls.FlyoutControl
{
public sealed partial class CustomContentDialog : ContentDialog
{
public CustomContentDialog()
{
this.InitializeComponent();
}
// 用户点击了第一个按钮
private async void ContentDialog_PrimaryButtonClick(ContentDialog sender, ContentDialogButtonClickEventArgs args)
{
// 通过 GetDeferral() 来等待长时任务，否则即使 await 了也不会等
ContentDialogButtonClickDeferral deferral = args.GetDeferral();
try
{
await Task.Delay(1);
}
finally
{
// 完成异步操作
                deferral.Complete();
}
// 使此事件可以冒泡（当然 args.Cancel 默认就是 false）
args.Cancel = false;
}
// 用户点击了第二个按钮
private async void ContentDialog_SecondaryButtonClick(ContentDialog sender, ContentDialogButtonClickEventArgs args)
{
// 通过 GetDeferral() 来等待长时任务，否则即使 await 了也不会等
ContentDialogButtonClickDeferral deferral = args.GetDeferral();
try
{
await Task.Delay(1);
}
finally
{
// 完成异步操作
                deferral.Complete();
}
// 使此事件可以冒泡（当然 args.Cancel 默认就是 false）
args.Cancel = false;
}
}
}
　　Controls/FlyoutControl/ContentDialogDemo.xaml



<Page
x:Class="Windows10.Controls.FlyoutControl.ContentDialogDemo"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Windows10.Controls.FlyoutControl"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="Transparent">
<StackPanel Margin="10 0 10 10">
<Button Name="btnShowDialog" Margin="5" Content="弹出一个标准的对话框" Click="btnShowDialog_Click" />
<Button Name="btnShowCustomDialog" Margin="5" Content="弹出一个自定义的对话框" Click="btnShowCustomDialog_Click" />
<TextBlock Name="lblMsg" Margin="5" />
</StackPanel>
</Grid>
</Page>
　　Controls/FlyoutControl/ContentDialogDemo.xaml.cs



/*
* ContentDialog - 内容对话框（继承自 ContentControl, 请参见 /Controls/BaseControl/ContentControlDemo/）
*     FullSizeDesired - 是否全屏弹出对话框
*     Title, TitleTemplate - 对话框的标题（可以自定义样式）
*     Content, ContentTemplate - 对话框的内容（可以自定义样式）
*     PrimaryButtonText - 对话框第一个按钮显示的文本
*     SecondaryButtonText - 对话框第二个按钮显示的文本
*     PrimaryButtonCommand, PrimaryButtonCommandParameter, SecondaryButtonCommand, SecondaryButtonCommandParameter - 按钮命令及命令参数
*     
*     PrimaryButtonClick - 第一个按钮按下时触发的事件
*     SecondaryButtonClick - 第二个按钮按下时触发的事件
*     Closed, Closing, Opened - 顾名思义的一些事件
*     
*     ShowAsync() - 弹出对话框
*     Hide() - 隐藏对话框
*     
*
* 注意：自定义的内容对话框参见 CustomContentDialog.xaml
*/
using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
namespace Windows10.Controls.FlyoutControl
{
public sealed partial class ContentDialogDemo : Page
{
public ContentDialogDemo()
{
this.InitializeComponent();
}
private async void btnShowDialog_Click(object sender, RoutedEventArgs e)
{
ContentDialog dialog = new ContentDialog()
{
Title = "dialog title",
Content = "dialog content, dialog content, dialog content, dialog content, dialog content, dialog content, dialog content",
FullSizeDesired = true,
PrimaryButtonText = "PrimaryButton",
SecondaryButtonText = "SecondaryButton"
};
dialog.PrimaryButtonClick += dialog_PrimaryButtonClick;
dialog.SecondaryButtonClick += dialog_SecondaryButtonClick;
// 弹出对话框，返回值为用户的选择结果
/*
* ContentDialogResult.Primary - 用户选择了第一个按钮
* ContentDialogResult.Secondary - 用户选择了第二个按钮
* ContentDialogResult.None - 用户没有选择（按了系统的“返回”按钮）
*/
ContentDialogResult result = await dialog.ShowAsync();
if (result == ContentDialogResult.Primary)
{
lblMsg.Text += "选择了第一个按钮";
lblMsg.Text += Environment.NewLine;
}
else if (result == ContentDialogResult.Secondary)
{
lblMsg.Text += "选择了第二个按钮";
lblMsg.Text += Environment.NewLine;
}
else if (result == ContentDialogResult.None)
{
lblMsg.Text += "没有选择按钮";
lblMsg.Text += Environment.NewLine;
}
}
void dialog_PrimaryButtonClick(ContentDialog sender, ContentDialogButtonClickEventArgs args)
{
lblMsg.Text += "点击了第一个按钮";
lblMsg.Text += Environment.NewLine;
}
void dialog_SecondaryButtonClick(ContentDialog sender, ContentDialogButtonClickEventArgs args)
{
lblMsg.Text += "点击了第二个按钮";
lblMsg.Text += Environment.NewLine;
}

// 弹出自定义对话框
async private void btnShowCustomDialog_Click(object sender, RoutedEventArgs e)
{
// 实例化自定义对话框
CustomContentDialog contentDialog = new CustomContentDialog();
// 弹出对话框，返回值为用户的选择结果
/*
* ContentDialogResult.Primary - 用户选择了第一个按钮
* ContentDialogResult.Secondary - 用户选择了第二个按钮
* ContentDialogResult.None - 用户没有选择（按了系统的“返回”按钮）
*/
ContentDialogResult result = await contentDialog.ShowAsync();
if (result == ContentDialogResult.Primary)
{
lblMsg.Text += "选择了第一个按钮";
lblMsg.Text += Environment.NewLine;
}
else if (result == ContentDialogResult.Secondary)
{
lblMsg.Text += "选择了第二个按钮";
lblMsg.Text += Environment.NewLine;
}
else if (result == ContentDialogResult.None)
{
lblMsg.Text += "没有选择按钮";
lblMsg.Text += Environment.NewLine;
}
}
}
}
　　
OK
[源码下载]