WinUI 3 中的自定义内容对话框

Question

在我的程序中，我有一个带有多个选项卡的 TabControl，每个选项卡中可能有一个用户可以随时打开的对话框。我使用对话框允许用户将内容输入数据库。我希望复制原始 ContentDialog 的外观和功能，但不限于一次只能打开 1 个。

这个想法是沿着面板的路线，浮动在选项卡控件项的其余部分（但不是整个应用程序窗口）上，并拒绝与其下面的选项卡控件（但不是整个程序）中的任何内容进行交互，直到关闭.

Microsoft 目前对 ContentDialog 的限制：

“每个线程一次只能打开一个 ContentDialog。尝试打开两个 ContentDialog 将引发异常，即使它们试图在单独的应用程序窗口中打开。”

https://learn.microsoft.com/en-us/windows/windows-app-sdk/api/winrt/microsoft.ui.xaml.controls.contentdialog?view=windows-app-sdk-1.4

解决这个问题的最佳方法是什么？

Answer 1

在没有

ContentDialog

的情况下实现您想要做的事情的一种方法是在选项卡内容顶部显示一个图层，并在该图层顶部显示您想要在

ContentDialog

上显示的内容。

<TabView>
    <TabView.TabItems>
        <TabViewItem
            VerticalContentAlignment="Stretch"
            Header="Tab #1">
            <Grid>
                <Grid
                    x:Name="ContentPanel"
                    VerticalAlignment="Stretch">
                    <Button
                        Click="ShowMessageButton_Click"
                        Content="Show message" />
                </Grid>

                <StackPanel
                    x:Name="MessageBasePanel"
                    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
                    Opacity="0.5"
                    Visibility="Collapsed" />
                <StackPanel
                    x:Name="MessagePanel"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Visibility="Collapsed">
                    <TextBlock Text="Some message." />
                    <Button
                        Click="CloseMessageButton_Click"
                        Content="Close" />
                </StackPanel>
            </Grid>

        </TabViewItem>
        <TabViewItem Header="PowerShell">
            <TabViewItem.IconSource>
                <BitmapIconSource
                    ShowAsMonochrome="False"
                    UriSource="/Assets/TabViewIcons/powershell.png" />
            </TabViewItem.IconSource>
        </TabViewItem>
        <TabViewItem Header="Windows Subsystem for Linux">
            <TabViewItem.IconSource>
                <BitmapIconSource
                    ShowAsMonochrome="False"
                    UriSource="/Assets/TabViewIcons/linux.png" />
            </TabViewItem.IconSource>
        </TabViewItem>
    </TabView.TabItems>
</TabView>

private void ShowMessageButton_Click(object sender, Microsoft.UI.Xaml.RoutedEventArgs e)
{
    this.MessageBasePanel.Visibility = Visibility.Visible;
    this.MessagePanel.Visibility = Visibility.Visible;
}

private void CloseMessageButton_Click(object sender, Microsoft.UI.Xaml.RoutedEventArgs e)
{
    this.MessageBasePanel.Visibility = Visibility.Collapsed;
    this.MessagePanel.Visibility = Visibility.Collapsed;
}