CODEWITHSUNDEEP
navigationuwpwindows-10
jenkins
jenkins

Reputation: 656

How to fully disable back button in UWP Hosted App (JS)

I have a UWP hosted app (JavaScript) that points to a website.

Inside the website, I have an iframe that allows navigation to different URLs.

When the iframe navigates, the "back" button of the UWP app suddenly appears in the title bar.

I want to fully disable / remove that back button, because:

  1. When clicked, it crashes the app if the iframe is no longer in the DOM
  2. In my case, back navigation is not relevant for the content inside the iframe
  3. The website is a single page webapp and there is just no need for back navigation in general

The MSDN documentation says that the title bar back button should be disabled by default. I have not done anything to enable it.

I have tried intercepting the event as follows, but the iframe still does the back navigation (or the app crashes if there's no longer an iframe):

    // In the main website window (not the iframe)
    var uiCore = Windows.UI.Core;
    var navMgr = uiCore.SystemNavigationManager.getForCurrentView();
    navMgr.onbackrequested = (e) => {
        console.log("Back navigation"); // This is never logged
        navMgr.appViewBackButtonVisibility = uiCore.AppViewBackButtonVisibility.collapsed;
        e.handled = true;
    };

Does anyone know how to prevent the UWP platform from adding the back button for hosted apps?

Upvotes: 3

Views: 1794

Answers (2)

NoWar
NoWar

Reputation: 37652

Well... In a Microsoft UWP samples you can find another approach to hide/show this button. I just used their sample like a skeleton for my UWP app. So what I did to hide back arrow is following.

public RootFrameNavigationHelper(Frame rootFrame, Microsoft.UI.Xaml.Controls.NavigationView currentNavView)
    {
    ...
      if (ApiInformation.IsApiContractPresent("Windows.Foundation.UniversalApiContract", 6))
      {
                    // Add two lines
                    CurrentNavView.IsBackEnabled = false;
                    CurrentNavView.IsBackButtonVisible =  Microsoft.UI.Xaml.Controls.NavigationViewBackButtonVisible.Collapsed;
                    // And comment this line 
                    //CurrentNavView.BackRequested += NavView_BackRequested;
      }
    ...
    }

Upvotes: 1

Dale Harris
Dale Harris

Reputation: 607

Instead of hooking up the onBackRequested() callback, you should be able to just turn off the back button visibility with this part of your code:

var uiCore = Windows.UI.Core;
var navMgr = uiCore.SystemNavigationManager.getForCurrentView();
navMgr.appViewBackButtonVisibility = uiCore.AppViewBackButtonVisibility.collapsed;

Upvotes: 2

Related Questions