locked
How to find tapped item in StackPanel list?

    Question

  • Hi!

    How do I find what item in the stackpanel list that was tapped?

    <Grid> <StackPanel x:Name="MenuList" HorizontalAlignment="Left" Tapped="MenuList_Tapped" > <ItemsControl ItemsSource="{Binding Path=MenuItems}"> <ItemsControl.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal" Margin="20,20,0,0" Tag="{Binding Path=Title, Mode=OneWay}"> <Image Source="{Binding Path=Image, Mode=TwoWay}"/> <TextBlock Margin="10,0,20,0" Text="{Binding Path=Title, Mode=TwoWay}" Style="{StaticResource HeaderTextBlockStyle}"/> </StackPanel> </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl> </StackPanel> </Grid

            private void MenuList_Tapped(object sender, TappedRoutedEventArgs e)
            {
                StackPanel itm = sender as StackPanel;
                Object obj = itm.Tag;
            }
    
    Thanks, Sigurd F
    Friday, June 20, 2014 1:09 PM

Answers

  • Check the OriginalSource passed in the arguments. This probably isn't quite what you want, but you can use VisualTreeHelper to walk up from there to the item you want. You could also use the Position and the VisualTreeHelper. This will be purely visual and not tied to the bound data, but once you find the interior StackPanel you could check its tag.

    More straightforward would be to use a ListView instead of the ItemsControl and listen for ItemClicked or selection, or listen on the interior StackPanel and check sender.

    If the goal is to act like a button then use a Button.

    However you do this, make sure to wire it up for keyboard as well as touch. Using the correct controls rather than compiling your own will automatically implement keyboard handling and automation properties. If you roll your own from components you'll need to implement this yourself.

    • Marked as answer by Sigurd F Tuesday, June 24, 2014 8:21 AM
    Friday, June 20, 2014 1:26 PM
    Owner
  • Hi Sigurd,
    You should make use of the powerful capabilities of the ListView check this sample .

    Regards,


    Ibraheem Osama Mohamed | My Blog | @IbraheemOM | My Website

    (If my reply answers your question, please propose it as an answer)

    • Marked as answer by Sigurd F Tuesday, June 24, 2014 8:21 AM
    Monday, June 23, 2014 8:57 PM

All replies

  • Check the OriginalSource passed in the arguments. This probably isn't quite what you want, but you can use VisualTreeHelper to walk up from there to the item you want. You could also use the Position and the VisualTreeHelper. This will be purely visual and not tied to the bound data, but once you find the interior StackPanel you could check its tag.

    More straightforward would be to use a ListView instead of the ItemsControl and listen for ItemClicked or selection, or listen on the interior StackPanel and check sender.

    If the goal is to act like a button then use a Button.

    However you do this, make sure to wire it up for keyboard as well as touch. Using the correct controls rather than compiling your own will automatically implement keyboard handling and automation properties. If you roll your own from components you'll need to implement this yourself.

    • Marked as answer by Sigurd F Tuesday, June 24, 2014 8:21 AM
    Friday, June 20, 2014 1:26 PM
    Owner
  • Ok, look like I should go for ListView then. Which also was my initial ide, only I did'n find any examples to help me to get started. I'm actually making a menu.


    Regards, Sigurd F

    Friday, June 20, 2014 1:54 PM
  • Hi Sigurd,
    You should make use of the powerful capabilities of the ListView check this sample .

    Regards,


    Ibraheem Osama Mohamed | My Blog | @IbraheemOM | My Website

    (If my reply answers your question, please propose it as an answer)

    • Marked as answer by Sigurd F Tuesday, June 24, 2014 8:21 AM
    Monday, June 23, 2014 8:57 PM
  • Thanks!

    Regards, Sigurd F

    Tuesday, June 24, 2014 8:22 AM