MAUI Shell + TabbedPage

Question

I have application based on Shell. Application contains pages with tabs which are defined in Shell. Everything works properly and correctly.

I need create second level page with tabs which contains options for return to previous page. In the case of standard "ContentPage", "Routing.RegisterRoute" and "Shell.Current.GoToAsync" it is no problem. However, if I create a TabbedPage like this, my application ends with exception:

0xFFFFFFFFFFFFFFFF in Android.Runtime.JNIEnv.monodroid_debugger_unhandled_exception

I am aware of this information:

TabbedPage is incompatible with .NET MAUI Shell apps, and an exception will be thrown if you attempt to use TabbedPage in a Shell app.

1. However, I am not sure if this also applies to the second level page, or only to pages that are directly referenced in Shell.
2. How can I create second level page with tabs?

Is there anyone who has encountered a similar problem, or someone who can give me advice?

Thanks a lot

Answer 1

Using shell, you are limited to content pages. Navigating to such page is not a problem. Calling GoToAsync will give you the "second layer" you request.

The more interesting part is how to implement tab control, so you have tabs in that ContentPage.

One way to solve this is by using BindableLayouts.

(Here is a good example: https://dev.to/davidortinau/making-a-tabbar-or-segmentedcontrol-in-net-maui-54ha)

You can make really neat UI with this. It will be worth your time.

Ask if you have any questions.

Answer 2

You can combine TabbedPage, FlyoutPage and NavigationPage instead of shell if you really want to create second level page with tabs. Obviously shell is based on flyouts and tabs, so if you use FlyoutPage and TabbedPage alone in your project, it will be more flexible and troublesome than the shell.

These are the documents about the specific use of FlyoutPage and TabbedPage, you can refer to them if you need: https://learn.microsoft.com/en-us/dotnet/maui/user-interface/pages/flyoutpage?view=net-maui-7.0 and https://learn.microsoft.com/en-us/dotnet/maui/user-interface/pages/navigationpage?view=net-maui-7.0.

Hope this will help you.