windows phone 8.1开发:(消息弹出框)强大的ContentDialog

原文出自:http://www.bcmeng.com/contentdialog/

在应用开发中我们必不可少的会使用到消息框,windows phone8中的messagebox在windows phone8.1中变成了MessageDialog.使用方法大体相差不大.不过MessageDialog的功能过于简单,许多时候无法满足我们的实际需要.在windows phone 8.1中出现了ContentDialog,ContentDialog不仅可以选择半屏或者全屏展示,里面的内容还可以像一个XAML页面一样实现自定义.
下面我们通过代码和实际运行效果来看一下:

ContentDialog半屏:

private  async void Button_Click(object sender, RoutedEventArgs e)//半屏
        {
            ContentDialog dialog = new ContentDialog()
            {
                Title = "Download updates?", //标题
                Content = "This update will clean the slate for Iron Man",//内容
                FullSizeDesired=false,  //是否全屏展示
                PrimaryButtonText = "Yes, clean it",//第一个按钮内容
                SecondaryButtonText = "No, Dont!"
            };
            dialog.SecondaryButtonClick += dialog_SecondaryButtonClick;//第二个按钮单击事件
            dialog.PrimaryButtonClick += dialog_PrimaryButtonClick;

            ContentDialogResult result = await dialog.ShowAsync();
            if (result == ContentDialogResult.Primary) { } //处理第一个按钮的返回
            else if (result == ContentDialogResult.Secondary) { }//处理第二个按钮的返回

        }

       async  void dialog_PrimaryButtonClick(ContentDialog sender, ContentDialogButtonClickEventArgs args)
        {
            await new MessageDialog("您选择了第一个按钮").ShowAsync();
        }

        async  void dialog_SecondaryButtonClick(ContentDialog sender, ContentDialogButtonClickEventArgs args)
        {
            await new MessageDialog("您选择了第二个按钮").ShowAsync();
        }

ContentDialog全屏:

private async void Button_Click_1(object sender, RoutedEventArgs e)//全屏
        {
            ContentDialog contentdialog = new ContentDialog();
            contentdialog.Title = "编程小梦";
            contentdialog.Content = "专注于windows phone应用开发";
            contentdialog.PrimaryButtonText = "赞一个";
            contentdialog.SecondaryButtonText = "顶一个";
            contentdialog.FullSizeDesired = true;
            await contentdialog.ShowAsync();
        }

ContentDialog自定义1:

<ContentDialog
    x:Class="ContentDialogDemo.ContentDialog1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ContentDialogDemo"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="DIALOG TITLE"
    PrimaryButtonText="sign in"
    SecondaryButtonText="cancel"
    PrimaryButtonClick="ContentDialog_PrimaryButtonClick"
    SecondaryButtonClick="ContentDialog_SecondaryButtonClick">

    <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" Style="{StaticResource MessageDialogContentStyle}" TextWrapping="Wrap">
            <TextBlock.Text>
                Lorem ipsum dolor sit amet, consectetur adipisicing elit,
                    sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
            </TextBlock.Text>
        </TextBlock>
    </StackPanel>
</ContentDialog>

调用方法:

ContentDialog1 contentDialog1 = new ContentDialog1(); //ContentDialog1是系统自带的内容对话框页面
       await contentDialog1.ShowAsync();

ContentDialog自定义2:

<ContentDialog
    x:Class="ContentDialogDemo.ContentDialog2"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ContentDialogDemo"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="小梦词典"
    PrimaryButtonText="关于"
    SecondaryButtonText="好评"
    PrimaryButtonClick="ContentDialog_PrimaryButtonClick"
    SecondaryButtonClick="ContentDialog_SecondaryButtonClick"
<Grid >
        <GridView  HorizontalAlignment="Center">

            <GridViewItem Margin="5">
                <Button  Content="查词" Background="#FFC5246D"
                        ></Button>
            </GridViewItem>
            <GridViewItem Margin="5">
                <Button Content="翻译"  Background="#FFEAC418"
                        Name="translate" ></Button>
            </GridViewItem>
            <GridViewItem Margin="5">
                <Button Content="生词"  Background="#FFCB32DA"
                       ></Button>
            </GridViewItem>
            <GridViewItem Margin="5">
                <Button Content="关于"  Background="#FF58E4B5"
                        ></Button>
            </GridViewItem>
        </GridView>
    </Grid>
</ContentDialog>

调用方法和上面一样,最终运行效果如下: