个性化定制 Windows Phone 8.1 的消息对话框

Question

我想自定义消息对话框，就像以下图片所示

我已经准备好了相应的XAML，该如何实现呢？

   <StackPanel Name="rootStackPanel" Height="Auto"  Background="#363636" VerticalAlignment="Top">
        <StackPanel Margin="10">
            <StackPanel Margin="0,0,0,10" Orientation="Horizontal">
                <TextBlock x:Name="HeadingText" x:FieldModifier="public" Style="{StaticResource ApplicationMessageBoxHeadingStyle}" Text="Alert"  />
                <Image Margin="10,05,0,0" Source="/Assets/Images/alert.png" Width="35"></Image>
            </StackPanel>
            <TextBlock x:FieldModifier="public" x:Name="ContentText" Style="{StaticResource ApplicationMessageBoxErrorStyle}" Text="Pease enter a valid plate number" />
            <Button x:FieldModifier="public"   Name="OkButton" Margin="0,20,0,0" Padding="0"  HorizontalAlignment="Left" Content="Ok"  Style="{StaticResource ApplicationThemeButtonStyle}"/>
        </StackPanel>
    </StackPanel>

- Ghazanfar Khan

Answer 1

你所要实现的外观是非标准的，如果想要这个确切的效果，你需要编写一些自定义代码。如果重点在于警报标题中的图标，那么使用ContentDialog就很容易实现。

MessageDialog是不可定制的，但ContentDialog是可以的。你可以通过Add.New Item...菜单向项目添加一个新的ContentDialog模板。

一旦你拥有了ContentDialog文件，你可以自定义模板并将其按钮标题设置为“确定”：

<ContentDialog
    x:Class="MyApp.AlertDialog"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:MyApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="Alert"
    PrimaryButtonText="OK"  
    PrimaryButtonClick="ContentDialog_PrimaryButtonClick"
    >

在标题模板中，除了标题之外，还要包括您的alert.png图标。更高级的版本将允许为不同目的绑定不同的图标。您也可以填充路径而不是绘制png，这样图标就可以更轻松地进行缩放。

    <ContentDialog.TitleTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding}" Foreground="{ThemeResource PhoneAccentBrush}"/>
                <Image Source="/Assets/Images/alert.png" />
            </StackPanel>
        </DataTemplate>
    </ContentDialog.TitleTemplate>

然后在 ContentDialog 的 Xaml 中包含其余的内容：

<StackPanel>
    <TextBlock x:FieldModifier="public" x:Name="ContentText" Style="{StaticResource ApplicationMessageBoxErrorStyle}" Text="Pease enter a valid plate number" />
</StackPanel>

这将使确定按钮位于标准位置——右下角。如果您想将其与文本一起包含，则可以像示例代码中一样将其置于StackPanel中，并且不设置ContentDialog上的PrimaryButtonText。

- Rob Caplan - MSFT

Answer 2

在项目中创建一个用户控件。 将整个XAML代码放入用户控件中。 现在，您可以在任何想要使用它的地方将此用户控件用作弹出窗口。

Popup msgpopup = new Popup( );
msgpopup.child = new CustomisedMessageDialogControl(); //name of ur Usercontrol

而要打开这个对话框，只需

msgpopup.IsOpen = true;

- Denil Parmar