Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to show Popup/Flyout at clicked item in ListView/GridView in Windows Store App

I am working on a Windows Store App and would like to show some additional information about an Item that was clicked in ListView or GridView. This information should be shown in a Popup or Flyout (hast do be definded in C#, not in XAML) next to the clicked item.

The Problem is, that the ItemClick event handler gives no information about the clicked visual item but only about the data item. Thus I have no information about where to show the Flyout or Popup on screen.

like image 290
Andrei Herford Avatar asked Mar 14 '14 15:03

Andrei Herford


1 Answers

Use attached Flyout:

<DataTemplate x:Key="ListItemTemplate">
    <Grid RightTapped="ListRightTapped" Tapped="ListTapped" Background="Transparent">
        <Grid>
            ...
        </Grid>
        <FlyoutBase.AttachedFlyout>
            <Flyout Closed="listFlyout_Closed">
                <StackPanel>
                    ...
                </StackPanel>
            </Flyout>
        </FlyoutBase.AttachedFlyout>
    </Grid>
</DataTemplate>

And the code:

private void ListRightTapped( object sender, RightTappedRoutedEventArgs e )
{
    FlyoutBase.ShowAttachedFlyout( sender as FrameworkElement );
}
like image 73
crea7or Avatar answered Sep 23 '22 19:09

crea7or