Wie verwenden Sie das ContextFlyout mit einem ListView?

Question

Ich versuche, meiner UWP-App ein MenuFlyout zur Unterstützung eines Controllers hinzuzufügen. Das Problem ist, dass ich nicht herausfinden kann, wie man bestimmt, welches ListViewItem das Ereignis tatsächlich ausgelöst hat.

Codebehind

public sealed partial class MainPage : Page 
{ 
    public MainPage() 
    { 
     this.InitializeComponent(); 

     this.DataContext = new List<String>{ "Item 1", "Item 2", "Item 3"}; 
    } 

    private void ChoiceA_Click(object sender, RoutedEventArgs e) 
    { 
     // What was clicked? 
    } 
} 

XAML

<ListView ItemsSource="{Binding}"> 
     <ListView.ItemContainerStyle> 
      <Style TargetType="ListViewItem"> 
       <Setter Property="ContextFlyout"> 
        <Setter.Value> 
         <MenuFlyout> 
          <MenuFlyoutItem Text="Choice A" Click="ChoiceA_Click" /> 
          <MenuFlyoutItem Text="Choice B" /> 
         </MenuFlyout> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </ListView.ItemContainerStyle> 
    </ListView> 

Answer 1

ich Ihr Code mit lokalen und Mobil-Emulator nur getestet, Ihre MenuFlyout kann nur auf PC direkt am ListView angezapft gezeigt wird, dann ist hier eine Lösung, können Sie die OriginalSource im RightTapped Fall ListView finden, dann holen Sie sich die DataContext dieser OriginalSource zum Beispiel wie folgt aus:

private FrameworkElement originalSource; 
private void ChoiceA_Click(object sender, RoutedEventArgs e) 
{ 
    var itemdatacontext = originalSource.DataContext; 
} 

private void ListView_RightTapped(object sender, RightTappedRoutedEventArgs e) 
{ 
    originalSource = (FrameworkElement)e.OriginalSource; 
} 

Answer 2

diese Lösung versuchen. Zuerst müssen Sie Ihr XAML ändern, da die Klasse ListViewItem nicht über die Eigenschaft ContextFlyout verfügt. Sie müssen FlyoutBase.AttachedFlyout in ItemTemplate verwenden.

<ListView ItemsSource="{Binding}"> 
    <ListView.ItemTemplate> 
     <DataTemplate> 
      <TextBlock Text="{Binding}" Tapped="TextBlock_Tapped"> 
       <FlyoutBase.AttachedFlyout> 
        <MenuFlyout> 
         <MenuFlyoutItem Text="{Binding}" IsHitTestVisible="False" FontWeight="Bold" FontSize="24" /> 
         <MenuFlyoutItem Text="Choice A" Click="MenuFlyoutItem_Click" /> 
         <MenuFlyoutItem Text="Choice B" /> 
        </MenuFlyout> 
       </FlyoutBase.AttachedFlyout> 
      </TextBlock> 
     </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView> 

Hier ist der Code-behind:

public sealed partial class Mainpage: Seite { public Mainpage() { this.InitializeComponent(); this.DataContext = neue Liste {"Eintrag 1", "Eintrag 2", "Eintrag 3"}; }

private async void MenuFlyoutItem_Click(object sender, RoutedEventArgs e) 
    { 
     var fe = sender as FrameworkElement; 
     var value = fe.DataContext.ToString(); 
     await new MessageDialog(value).ShowAsync(); 
    } 

    private void TextBlock_Tapped(object sender, TappedRoutedEventArgs e) 
    { 
     var fe = sender as FrameworkElement; 
     var menu = Flyout.GetAttachedFlyout(fe); 
     menu.ShowAt(fe); 
    } 
} 

Sie benötigen das ItemTapped Ereignis jeden einzelnen Artikels in der Listview erkennen, so dass Sie das Menü anzeigen.

Answer 3

binden an die Opening Ereignis des MenuFlyout. Im Event-Handler ist der sender der MenuFlyout selbst. Dort finden Sie die Target Eigenschaft, die auf die ListViewItem verweist.

Basierend auf Ihrem Beispiel XAML könnte wie folgt aussehen:

<ListView ItemsSource="{Binding}"> 
     <ListView.ItemContainerStyle> 
      <Style TargetType="ListViewItem"> 
       <Setter Property="ContextFlyout"> 
        <Setter.Value> 
         <MenuFlyout Opening="ListView_Opening"> 
          <MenuFlyoutItem Text="Choice A" Click="ChoiceA_Click" /> 
          <MenuFlyoutItem Text="Choice B" /> 
         </MenuFlyout> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </ListView.ItemContainerStyle> 
    </ListView> 

hinter Ihrem Code so geht:

public sealed partial class MainPage : Page 
{ 
    public MainPage() 
    { 
     this.InitializeComponent(); 

     this.DataContext = new List<String>{ "Item 1", "Item 2", "Item 3"}; 
    } 

    private string ListViewItemString; 

    private void ChoiceA_Click(object sender, RoutedEventArgs e) 
    { 
     // What was clicked? 
     var clickedItem = ListViewItemString; 
    } 

    private void ListView_Opening(object sender, object e) 
    { 
     ListViewItemString = ((sender as MenuFlyout)?.Target as ListViewItem)?.Content as string; 
    } 
}