ContextFlyout을 ListView와 함께 어떻게 사용합니까?

Question

컨트롤러를 지원하기 위해 UWP 앱에 MenuFlyout을 추가하려고합니다. 문제는 어떤 ListViewItem이 이벤트를 실제로 트리거했는지 확인하는 방법을 파악할 수 없다는 것입니다.

코드 숨김

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

난 그냥 그 지역의 기계 및 모바일 에뮬레이터와 코드, 당신의 MenuFlyout가 ListView에 도청 권리 만 PC에 표시 수있는 테스트

후 여기에 솔루션입니다, 당신은 다음, ListView의 RightTapped 이벤트에 OriginalSource을 찾을 수 있습니다 이 같은 예를 들어이 OriginalSource의 DataContext를 얻을 다음 MenuFlyout의 Opening 이벤트에

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

은이 솔루션을 사용해보십시오. 우선 ListViewItem 클래스에 ContextFlyout 속성이 없으므로 XAML을 수정해야합니다. ItemTemplate 내에서 FlyoutBase.AttachedFlyout을 사용해야합니다. 여기

<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> 

코드 숨김

공중 partial 클래스 MainPage 밀봉 : 페이지 { 공개 MainPage() { this.InitializeComponent을(); this.DataContext = 새 목록 { "항목 1", "항목 2", "항목 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); 
    } 
} 

당신은 당신이 메뉴를 표시 할 수 있도록 ListView에 내부의 모든 단일 항목의 ItemTapped 이벤트를 감지해야합니다.

는

Answer 3

바인딩. 이벤트 처리기에서 sender은 MenuFlyout입니다. 여기서 ListViewItem을 가리키는 Target 속성을 찾을 수 있습니다. 귀하의 예를 바탕으로

당신의 XAML은 다음과 같이 수 :

<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> 

귀하의 코드 뒤에 다음과 같이 진행됩니다

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; 
    } 
}