如何在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會引發錯誤。 我缺少什么？

UPDATE

錯誤是： 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是UIElement的屬性，而StackPanel是從UIElement派生的。

是的，您是對的，但是請注意，自引入的版本3.0（版本10.0.14393.0）以來，此ContextFlyout屬性可用。 您需要檢查API合約版本和設備系列版本。

對於@Igor Damiani建議的API合約版本1.0 / 2.0，可以使用FlyoutBase.AttachedFlyout ，並且可以在StackPanel的RightTapped事件中獲取DataContext ：

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

但是我注意到您的MenuFlyoutItem可以更改顏色，實際上需要訪問StackPanel內的UIElement或此StackPanel本身。 如果是這樣，最好將顏色綁定到由INotifyPropertyChanged接口實現的屬性。