相对面板中的上下文浮出控件的行为方式与网格中的行为方式不同

Question

>我希望能够在 RelativePanel 中使用 ContextFlyout 作为上下文菜单。 易于设置，但在 RelativePanel 的空白处右键单击(或长按)不会导致显示上下文菜单。 这与在网格中执行此操作相反，在网格中，右键单击可以在任何地方使用，即使在空白处也是如此。

显示差异的简单示例：

<Page
x:Class="ContextMenuTest2.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ContextMenuTest2"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel>
<RelativePanel BorderThickness="8" BorderBrush="Black" Height="200" Width="200">
<RelativePanel.ContextFlyout>
<MenuFlyout>
<MenuFlyoutItem Text="Menu Item"/>
</MenuFlyout>
</RelativePanel.ContextFlyout>
<TextBlock Height="auto" Width="auto">Relative Panel</TextBlock>
</RelativePanel>
<Grid BorderThickness="8" BorderBrush="Black" Height="200" Width="200">
<Grid.ContextFlyout>
<MenuFlyout>
<MenuFlyoutItem Text="Menu Item"/>
</MenuFlyout>
</Grid.ContextFlyout>
<TextBlock Height="auto" Width="auto">Grid</TextBlock>
</Grid>
</StackPanel>
</Grid>

Answer 1

Grid和RelativePanel都是没有任何背景的布局控件，这是解决问题的关键。

当您与RelativPanel内的区域交互并右键单击其中的空白区域时，由于RelativePanel没有背景，因此它不会接收右键单击事件并冒泡。如果尝试右键单击RelativePanel内的TextBlock，您将看到右键单击事件已捕获，并且显示上下文浮出控件。同样，当您像这样设置背景时：

<RelativePanel Background="Transparent" ...>

即使结果对用户来说看起来相同，背景现在也是透明彩色画笔(实际上是完全透明的白色)而不是null。这足以捕获用户输入。

为什么这在Grid中没有发生的问题起初也让我感到惊讶，但后来我在 XAML 设计器中意识到了原因。两个TextBlock控件都有AutoWidth和Height，但在RelativePanel中，这意味着TextBlock将仅覆盖它真正需要的大小，而Grid它是唯一的子项，Grid会导致它垂直和水平拉伸以填充面板。因此，当您单击Grid中的空白区域时，您实际上与TextBlock交互，并捕获右键单击事件并显示上下文浮出控件。