Odd Back Stack Behavior


April 2019


101 time


I am starting a new Windows 10 universal app using Template10. I added a GridView with a couple of items, which have as a property the Type of another Page to navigate to.

I created a new View and just added a header, like so:

<controls:PageHeader x:Name="PageHeader" Text="Payees">
<!--  place stretched, across top  -->
    <!--  secondary commands  -->


I have attached a behavior to the ItemClick that looks like this:

public void GridViewItemClick(object sender, object parameter)
    var arg = parameter as Windows.UI.Xaml.Controls.ItemClickEventArgs;

    var item = arg?.ClickedItem as AppPage;
    if (item?.TargetPage != null) NavigationService.Navigate(item.TargetPage);

Navigating to the new page works fine, but for some reason there is no back button in the header as there is in the other pages. If I switch to use the shell back button, then it will let me navigate back from the new page.

I changed on of the grid items to navigate to the existing SettingsPage as a test, and the back button is there in the header. However, if I navigate to the settings page multiple times, it adds a new instance on the back stack it seems. For example, the first time I navigate, then I click back once and I'm on the main page. If I go to settings again (via GridView), then I click back twice to get back to the main page, etc.

If I navigate to the settings page using the default "..." menu and going to one of the settings pages, then the back stack behaves as expected. I'm not entirely sure what I could be doing wrong since there isn't anything fancy going on here.


I have determined that this behavior is unique to navigating from a GridView. I created a test Button that navigates to my newly created page and the back stack behaves as expected, other than I only get a back arrow if I have the "use shell back button" setting enabled.

Here is what the attached behavior looks like in XAML, if it is of any help:

<GridView x:Name="MainGridView"
          ItemsSource="{Binding AppPages}">
        <core:EventTriggerBehavior EventName="ItemClick">
            <core:CallMethodAction MethodName="GridViewItemClick" TargetObject="{Binding Mode=OneWay}" />

1 answers


You need the Frame in your header.

<controls:PageHeader x:Name="PageHeader" 
    Text="Payees" Frame="{x:Bind Frame}" />