首页 > 代码库 > 背水一战 Windows 10 (37) - 控件(弹出类): MessageDialog, ContentDialog

背水一战 Windows 10 (37) - 控件(弹出类): MessageDialog, ContentDialog

[源码下载]


背水一战 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
[源码下载]

背水一战 Windows 10 (37) - 控件(弹出类): MessageDialog, ContentDialog