[SOLVED] Reset navigation stacks of all tabs in a Shell app

Reset navigation stacks of all tabs in a Shell app

I have a iOS/Android .NET MAUI Shell app with Tabs where users can login.

I want to reset all tabs to the root element if a user logins in or out of my app, but I can't find a way to do it.

Is there a way in .NET MAUI Shell to retrieve the navigation stack of all tabs, so I can pop all pages?

Or any other idea how to reset all Tabs to the root page?

Solution

One way to reset each Tab's navigation stack individually is to call PopToRootAsync() on each. For this you need to give each Tab a name:

<TabBar x:Name="MyTabBar">
    <Tab x:Name="Tab1">
        <ShellContent />
    </Tab>
    <Tab x:Name="Tab2">
        <ShellContent />
    </Tab>
</TabBar>

Then call PopToRootAsync() on each navigation stack in the code-behind of your AppShell:

await Tab1.Navigation.PopToRootAsync();
await Tab2.Navigation.PopToRootAsync();

This can be simplified if you give your TabBar an x:Name and then iterate through the Items and call PopToRootAsync() on each:

foreach(var tab in MyTabBar.Items)
{
    await tab.Navigation.PopToRootAsync();
}

Alternatively, you can also reset the MainPage to a new instance of AppShell in your App.xaml.cs:

MainPage = new AppShell();

This is a common scenario when login pages are not part of the Shell hierarchy, but should also work in your case.