How to clear Page NavigationCache in Windows 8 Store App

Windows 8 Store App got a nice concept of Page navigation, it supports users to navigate from pages within App, somewhat similar how you navigate on any single website.

I am not going to explain how Page Navigation works in Windows 8 store App. you can check this article on MSDN to learn Page Navigations.

I am going explain one small trick or workaround which I used in my 2 Apps and it’s worked well for me.

I faced an issue in my app where I want to maintain NavigationCache  but based on some condition. like in my TechEd India 2013 App if value of City is changed then I want to reload data from service but if city value is same then I want to use data from Cache, and there was another scenario in my Gold store kiosk App where I found this workaround.

Scenario: In my App I have a Page named as “CategoryDetails”, in this page I list out all the products based on Category. User can select a category on main page which navigate him to this page and display all items in that category.  I used GridView to display all items. On click on Item user will get navigated to ItemDetails page. Also there is another feature which allow user to select multiple items and from bottom App Bar he can add them to wish list. Many times after selecting 2-3 items user click on some item to check details and then again come back. here. Main issue is I was not able to maintain the selection of the items if you navigate to ItemDetails page and then come back.

To maintain selection I decided to enable PageNavigationCache and it worked . But it results me in another problem, since i use this same page to load items from different categories. user can select category on Home page or from Top App bar and then page load items for that particular category.

Issue: when user go to Home/Main using top app bar and select different category and come again back to this “CategoryDetails” page to view items in that,  it fails to load those new items, by default it shows the old data as page get loaded from Cache, with debugger I checked it doesn’t hit Load state method where i have my code to load the Items collection based on Parameter value (category id).

Expected result is – when I select some items on CategoryDetails page and if I navigate to ItemDetails page and then navigate back then it should maintain the Selection of items, if I navigate to Home page and select different category and come on this page then I should have New items related to New category and it should not show mi old data.

After lots of try, errors and studying the exact process of page navigation and page loading by adding break points I came to know that In “LayoutAwarePage.cs” there is “_pageKey” which plays important role in navigation cache. I tried following code and it worked for me.

I added following small method to “LayoutAwarePage.cs”

protected void ClearNavigationCache()
{
    this._pageKey = null;
}

And I added following code to CategoryDetails.xaml.cs page.

protected override void OnNavigatedT(Windows.UI.Xaml.Navigation.NavigationEventArgs e)
{
    // If Navigation is not Back then this code clears the NvigationsCache 
    // and which force system to run the load state method for new data. 

    if (e.NavigationMode != NavigationMode.Back)
    {               
        base.ClearNavigationCache();
    }

    base.OnNavigatedTo(e);
}

and last step is enable Cache mode on CategoryDetails.xaml page by adding following line at top of XAML page where we declare our namespaces on XAML page.

NavigationCacheMode="Enabled" 

Or you can also add it on CategoryDetails.xaml.cs inside Contractor of your page after you call InititializeComponent method.

public CategoryDetails()
{
    this.InitializeComponent();

    this.NavigationCacheMode = 
        Windows.UI.Xaml.Navigation.NavigationCacheMode.Enabled;
}

thats what I did and I got control on Page NavigationCache, now I can use data from cache or I can force my page to get new data.

similarly you can use it to clear navigation cache on any conditions. I used same trick in my TechEd India 2013 App. where I want to clear the page cache if SelectedCity of my App is changed.

protected override void OnNavigatedTo(Windows.UI.Xaml.Navigation.NavigationEventArgs e)
{          
    if (DefaultViewModel.Keys.Contains("SelectedCity"))
    {
        if (DefaultViewModel["SelectedCity"] != App.SelectedCity)
        {
            base.ClearNavigationCache();
        }
    }
    
    base.OnNavigatedTo(e);

}

I am sure many of you must be facing similar issue so sharing this with you. use it and enjoy !!!

Please Note: this is workaround I found while working on my app. It worked for me But please note that I am not aware any other side effect of nullifying “_pageKey” property so use this on your own risk. if you come to know any issue please do share with me.