如何在xaml中集成一个简单的ContentDialog?(C#)

Question

我不太明白如何制作一个简单的ContentDialog。基本上，我想要一个按钮，当按下时，ContentDialog会弹出。ContentDialog应至少有一个按钮。我想我错过了什么。我试着把我的代码部分放进去，但在构建程序时出现了错误。我的猜测是，我仍然需要在XAML中输入一些内容才能使其工作。这是.XAML的默认代码(在帖子的底部，你可以找到我想放入其中的代码(：

<Page
x:Class="PDFViewerSDK_Win10.PDFReaderPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:PDFViewerSDK_Win10"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" SizeChanged="OnSizeChanged">
<Page.Resources>
<DataTemplate x:Key="MenuItemTemplate">
<Grid HorizontalAlignment="Left" Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<StackPanel Margin="0,0,0,0" Orientation="Vertical">
<TextBlock TextWrapping="Wrap" Foreground="{StaticResource ApplicationForegroundThemeBrush}" Width="300" VerticalAlignment="Center" Text="{Binding Title}" HorizontalAlignment="Left" FontFamily="Segoe UI"/>
</StackPanel>
</Grid>
</DataTemplate>
</Page.Resources>
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="68"/>
<RowDefinition Height="*"/>
<RowDefinition Height="0.35*"/>
</Grid.RowDefinitions>
<Canvas x:Name="mPDFView" Grid.RowSpan="3"/>
<Canvas x:Name="mPDFThumb" Grid.Row="2" Visibility="Visible"/>
<ListView x:Name="mMenuView"
Background="{StaticResource ApplicationPageBackgroundThemeBrush}"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Margin="0, 68, 0, 0"
ItemTemplate="{StaticResource MenuItemTemplate}"
IsItemClickEnabled="True"
ItemClick="OnMenuListItemClicked"
Visibility="Collapsed"
ScrollViewer.VerticalScrollBarVisibility="Auto"
ScrollViewer.HorizontalScrollBarVisibility="Auto"
Grid.RowSpan="2"/>
<Grid Height="68" Margin="0" VerticalAlignment="Top" Background="#7FC0C0C0" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel HorizontalAlignment="Left" Grid.Column="0" Orientation="Horizontal">
<Button x:Name="backButton" Click="OnBtnGoBack" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource BackButtonStyle}" Margin="10,10,0,0" Foreground="Black" BorderBrush="Black" Background="Black" AllowDrop="True" VerticalAlignment="Top" RenderTransformOrigin="-1.62,0.618"/>
<Button x:Name="searchBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped">
<Image Source="Assets/images/view_search.png"/>
</Button>
<Button x:Name="viewAnnotBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped">
<Image Source="Assets/images/annot_line.png"/>
</Button>
<Button x:Name="doneAnnotBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped" Visibility="Collapsed">
<Image Source="Assets/images/annot_done.png"/>
</Button>
<Button x:Name="removeAnnotBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped" Visibility="Collapsed">
<Image Source="Assets/images/annot_remove.png"/>
</Button>
<Button x:Name="selectBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped">
<!--Image Source="Assets/images/icon_select.png"/-->
<BitmapIcon Name="mSelectIcon" UriSource="ms-appx:///Assets/images/icon_select.png" />
</Button>
<Button x:Name="viewMenuBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped">
<Image Source="Assets/images/icon_menu.png"/>
</Button>
<TextBox x:Name="mPageInput" Width="90"  Margin="30,10,5,10" FontSize="30" KeyDown="OnKeyDown"/>
<TextBlock x:Name="mPageDisplay" Width="90" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="30" Margin="0,10,0,10"/>
<Button x:Name="settingsBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped">
<Image Source="Assets/images/icon_setting.png"/>
</Button>
<Button x:Name="thumbnailBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnThumbItemTapped">
<Image Source="Assets/images/icon_thumbnail.png"/>
</Button>
<Image Source="Assets/images/icon_menu.png"/>
</StackPanel>
<StackPanel HorizontalAlignment="Right" Grid.Column="1" Orientation="Horizontal">
<Button x:Name="viewInfoBtn" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped">
<Image Source="Assets/images/view_about.png"/>
</Button>
</StackPanel>
</Grid>
</Grid>
<Page.BottomAppBar>
<AppBar x:Name="mAppBar">
<Grid  x:Name="PDFOptionPanel"/>
</AppBar>
</Page.BottomAppBar>
</Page>

现在我该把这部分代码放在哪里？我需要添加什么吗？我在这里错过了什么？

<ContentDialog x:Name="test" PrimaryButtonText="Ok" SecondaryButtonText="Cancel" Style="{StaticResource AppBarButtonStyle}" Tapped="OnOptionItemTapped" </ContentDialog>

Answer 1

源自官方文件

使用ContentDialog请求用户输入，或在模式对话框中显示信息。您可以使用代码或XAML将ContentDialog添加到应用程序页面，也可以创建从ContentDialog派生的自定义对话框类。这两种方法都显示在本主题的示例部分。

有很多方法可以将ContentDialog集成到页面中，如果你只制作一个简单的ContentDialog，你可以在代码后面实现它。

private async void DisplayNoWifiDialog()
{
ContentDialog noWifiDialog = new ContentDialog()
{
Title = "No wifi connection",
Content = "Check connection and try again.",
CloseButtonText = "Ok"
};
await noWifiDialog.ShowAsync();
}

如果你想用xaml实现它，请把你的ContentDialog放在根Grid的底部。例如：

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<TextBlock VerticalAlignment="Center" HorizontalAlignment="Center" Text="This is ContentDialog"/>
<Button Click="Button_Click" Content="ClickMe"/>
<ContentDialog x:Name="test" PrimaryButtonText="Ok" SecondaryButtonText="Cancel"  Tapped="OnOptionItemTapped" ></ContentDialog>
</Grid>

请注意，您提供的ContentDialog缺少>结束标记。有关更多信息，请参阅此。