Search code examples
windows-phone-7contextmenumenuitem-selection

Context menu for List in Windows phone


First of all, I know about this topic: How to make context menu work for windows phone?

But this way is SOO complicated... So I have this XAML code:

 <StackPanel Name="friendsGrid" Margin="0,0,0,0" Background="Transparent"> 
   <ListBox Name="friendsListBox" FontSize="32" Tap="friendsListBox_Tap">
     <toolkit:ContextMenuService.ContextMenu>
     <toolkit:ContextMenu Name="MyContextMenu" Opened="MyContextMenu_Opened">
     <toolkit:MenuItem Header="action" Click="contextMenuAction_Click"/>
     </toolkit:ContextMenu>
     </toolkit:ContextMenuService.ContextMenu>
   </ListBox>
 </StackPanel>

And I'm filling the list like this:

this.friendsListBox.Items.Add(friend.serviceName);

But, of course, when I do longtap, the context menu appears and selects the whole List, not only one item.

Is there some easy way to recognize the item was tapped? Thanks

BTW, I found this method, but contextMenuListItem doesn't recieve anything, it's still null:

ListBoxItem contextMenuListItem = friendsListBox.ItemContainerGenerator.ContainerFromItem((sender as ContextMenu).DataContext) as ListBoxItem;

Solution

  • You should put ContextMenu block into your ItemTemplate (not ListBox block). Here short sample.
    XAML:

                <ListBox Name="TestList" Margin="26,0,26,0" Height="380" >
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding}">
                            <toolkit:ContextMenuService.ContextMenu>
                                <toolkit:ContextMenu Name="ContextMenu" >
                                    <toolkit:MenuItem Name="Edit" Header="Edit" Click="Edit_Click"/>
                                    <toolkit:MenuItem Name="Delete"  Header="Delete" Click="Delete_Click"/>
                                </toolkit:ContextMenu>
                            </toolkit:ContextMenuService.ContextMenu>
                        </TextBlock>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
    

    Code:

        public List<string> Items = new List<string>
        {
            "Item1",
            "Item2",
            "Item3",
            "Item4",
            "Item5",
        };
    
        // Constructor
        public MainPage()
        {
            InitializeComponent();
            TestList.ItemsSource = Items;
        }
    
        private void Edit_Click(object sender, RoutedEventArgs e)
        {
            if (TestList.ItemContainerGenerator == null) return;
            var selectedListBoxItem = TestList.ItemContainerGenerator.ContainerFromItem(((MenuItem) sender).DataContext) as ListBoxItem;
            if (selectedListBoxItem == null) return;
            var selectedIndex = TestList.ItemContainerGenerator.IndexFromContainer(selectedListBoxItem);
            MessageBox.Show(Items[selectedIndex]);
        }
    

    Hope this helps.