2016-08-04 100 views
1

我想添加一個MenuFlyout到我的UWP應用程序來支持一個控制器。問題是,我不知道如何確定哪個ListViewItem實際觸發事件。如何將ListFrameout與ContextFlyout一起使用?

代碼隱藏

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> 

回答

1

我只是測試與本地機和移動仿真驗證碼,您MenuFlyout可以通過右鍵拍了拍ListView只能顯示在PC,那麼這裏是一個解決方案,你可以在RightTapped事件ListView找到OriginalSource,然後得到這個OriginalSource例如像這樣的DataContext

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

這適用於右鍵單擊,但xbox控制器上的菜單按鈕不會觸發事件。 – Johnny

+0

使用你的例子,我想通過使用FocusManager可以獲得焦點的項目。在GotFocus事件的頁面 私人無效Page_GotFocus(對象發件人,RoutedEventArgs E) { 如果(FocusManager.GetFocusedElement()作爲ListViewItem的!= NULL){ // 做的東西 }} – Johnny

0

嘗試這種解決方案。首先,您需要修改您的XAML,因爲類ListViewItem沒有屬性ContextFlyout。您需要在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> 

這裏代碼隱藏:

公共密封部分類的MainPage:頁 { 公共的MainPage() { this.InitializeComponent(); this.DataContext = new List {「Item 1」,「Item 2」,「Item 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); 
    } 
} 

您需要檢測每一個項目的ItemTapped事件的ListView裏面,這樣你就可以顯示菜單。

+0

ContextFlyout加入到Windows 10 SDK 10.0.14393.0 的https: //msdn.microsoft.com/library/windows/apps/windows.ui.xaml.uielement.contextflyout.aspx – Johnny

+0

哦,哇,對不起,我不知道!大! –

0

綁定到Opening事件MenuFlyout的。在事件處理程序中,sender本身就是MenuFlyout。在那裏你會發現Target屬性指向ListViewItem

根據你比如你的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; 
    } 
} 
相關問題