如何在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

ContextFlyout是UIElement的一個屬性，StackPanel是從UIElement派生而來的。

是的你是對的，但要注意這個ContextFlyout屬性自引入的3.0版本10.0.14393.0開始可用。你需要的是檢查你的API合同版本和設備系列版本。

對於API合約版1.0/2.0，爲@Igor Damiani的建議，你可以使用FlyoutBase.AttachedFlyout，你可以得到DataContext例如在RightTapped事件StackPanel的：

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

但我注意到，你的MenuFlyoutItem是可能的顏色改變，你需要的是實際上訪問StackPanel或StackPanel本身內的UIElements。如果是這樣，最好將顏色綁定到實現了界面的屬性。

Answer 2

試試這個：

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

你需要一點點代碼隱藏手動管理MenuFlyout。