如何在 UWP 的 StackPanel 中使用 ContextFlyout？

Question

在 GridView 中，我试图在用户右键单击某个项目时显示上下文菜单。

我试过了：

 <GridView.ItemTemplate>
    <DataTemplate>
       <StackPanel Orientation="Vertical" Width="120" Background="LightBlue">
       <StackPanel.ContextFlyout>
             <MenuFlyout>
                  <MenuFlyoutItem Text="Change color" Click="ChangeColorItem_Click" />
             </MenuFlyout>
...

但是 StackPanel.ContextFlyout 抛出一个错误。我缺少什么？

更新

错误是：The attachable property 'ContextFlyout' was not found in type 'StackPanel'

ContextFlyout 是属性的 UIElement，StackPanel 是从 UIElement 派生的。

Answer 1

试试这个：

   <DataTemplate>
      <StackPanel Orientation="Vertical" Width="120" Background="LightBlue">
         <FlyoutBase.AttachedFlyout>
            <MenuFlyout>
                <MenuFlyoutItem Text="Change color" Click="ChangeColorItem_Click" />
            </MenuFlyout>
         </FlyoutBase.AttachedFlyout>
      </StackPanel>
   </DataTemplate>

您需要使用一些隐藏代码手动管理 MenuFlyout。

Answer 2

ContextFlyout is a property of UIElement, and StackPanel is derived from UIElement.

是的你是对的，但是要注意这个ContextFlyout属性是从引入的3.0版本开始可用的，版本10.0.14393.0。您需要检查您的 API 合同版本和设备系列版本。

对于API合约版本1.0/2.0，正如@Igor Damiani所建议的，您可以使用FlyoutBase.AttachedFlyout，并且您可以在[=14=中获得DataContext ] StackPanel 事件：

private void StackPanel_RightTapped(object sender, RightTappedRoutedEventArgs e)
{
    FlyoutBase.ShowAttachedFlyout(sender as StackPanel);
    var datacontext = ((FrameworkElement)e.OriginalSource).DataContext;
}

但我注意到您的 MenuFlyoutItem 可以更改颜色，您实际上需要访问 StackPanel 或此 StackPanel 本身内的 UIElements。如果是这样，最好将颜色绑定到实现了 INotifyPropertyChanged 接口的属性。

如何在 UWP 的 StackPanel 中使用 ContextFlyout？

How use ContextFlyout in a StackPanel in UWP?

c#

xaml

uwp

uwp-xaml