Search code examples
c#windowsdesktopmaui

Implementing a Desktop TabView in .NET MAUI

I just got started with .NET MAUI. From the get-go I'm already having difficulty making the Windows deployment look like a typical Windows desktop app, which I find odd as it seemed to be largely marketed as achieving a native look on each platform.

I'm just trying to implement a TabView that look like this, for the Desktop version of the app - this is from the WinUI gallery, which to my understanding MAUI uses:

enter image description here

Or alternatively, like the classic WinForms one:

enter image description here

But unfortunately any Google search related to .NET MAUI seems to either focus on mobile deployments and aesthetics (e.g. https://learn.microsoft.com/en-us/dotnet/maui/user-interface/pages/tabbedpage):

enter image description here

Is it at all feasible to achieve the desktop aesthetics for the desktop version of a MAUI app? So far it feels like MAUI is actually a mobile UI framework that happens to run on desktops.

Solution

  • TL;DR:

    Can it be done? Possibly.

    Is it supported out-of-the-box in Maui? No.

    First, the close button ("X") on tabs is not supported in Maui. This is due to the mobile-first nature of Maui. Adding and removing tabs is possible, but only through hacks.

    Also the look-and-feel will carry the mobile-first design hints. Specifically the active tab will have an underline instead of the traditional raised tab outline.

    Finally there's the issue of placing the tabs on a specific part of the UI vs having the tabs for the entire UI. Maui only supports tabs for the entire window as opposed to a portion of the window. This doesn't seem to be an issue for your use-case, though.

    It should be mentioned that there are third-party vendors that provide additional Maui controls, but for tabs they seem to match the same design philosophy as the built-in Maui controls. Alternatively you can create custom controls that will allow you to do design things as you like, but you will quickly find yourself implementing many platform-specific implementations.