.NET MAUI brings some exciting innovations in .NET 7.0, which should quicken the heartbeats of all desktop developers. This comes as a pleasant surprise, especially because of the tight time window of only five and a half months between the delayed initial release of .NET MAUI on May 23, 2022 and the first major update at .NET Conf 2022 on November 7, 2022. Microsoft's cross-platform team had less than half as much time as other .NET product teams.

When Microsoft first announced .NET MAUI, the cross-platform framework was pitched as “the evolution of Xamarin.Forms, extended from mobile to desktop scenarios”.

While the promised extension was already in place with .NET 6 — after all, MAUI was already running on Windows and macOS — its desktop implementation still looked unfinished in some places. So it's great to see that the new features in .NET MAUI are clearly focused on the desktop.

Window builder

Opening multiple application windows has been common in desktop development for over 30 years. However, with the initial release of .NET MAUI and its predecessor Xamarin.Forms, opening new windows wasn’t possible due to the original focus on mobile operating systems. With .NET 7, there’s now a cross-platform way to open new windows using the Application object’s OpenWindow, shown in Listing 1.

Listing 1

private void OpenDetailsPageInNewWindow(Session session)
{
  var detailsVM = new SessionDetailPageViewModel
  {
    Session = session
  };
  var sessionPage = new SessionDetailPage(detailsVM);
  var window = new Window(sessionPage);
 
  Application.Current.OpenWindow(window);
}

The new functionality you see in Figure 1 can be used on Android, macOS, and iPadOS (iOS on the iPad). The iPhone doesn’t support opening new windows.

Fig. 1: .NET MAUI allows multiple application windows to be opened with .NET 7

Opening new windows isn’t the only windows-related improvement that .NET MAUI brings to .NET 7. On Windows, you can also configure the size and position of a window, as shown in Listing 2. However, the sample code only runs like this on Windows. On macOS, there’s at least a workaround that can be used to set the window size. On Android and iOS, it doesn’t work at all. Detailed instructions for the workaround can be found here.

Listing 2

protected override Window CreateWindow(IActivationState activationState)
{
  var window = base.CreateWindow(activationState);
 
  // Set window position
  window.X = 300;
  window.Y = 100;
 
  // Define window size
  window.Width = 700;
  window.Height = 800;
  return window;
}

Menus and ToolTips

In Xamarin.Forms, the SwipeView element can be used to open a side context menu with a horizontal swipe gesture, similar to what you know from email and messenger apps on your phone. This feature is also available in .NET MAUI, but unfortunately, it’s unusable for most desktop users. Opening a menu with a swipe gesture is unusual on desktop operating systems, unlike mobile devices, and users will most likely overlook it. The bigger problem is that this gesture cannot be performed with a mouse. Instead, you need a touchscreen to perform the gesture with a finger..

Microsoft solves this problem with the new context menus shown in Figure 1. They can be opened as usual on Windows and macOS by clicking the secondary mouse button. Context menus are not available on Android and iOS. As Listing 3 shows, context menu items are implemented by MenuFlyoutItem elements, which can have text, a command, or a click event handler, and an icon. However, icons are only supported on Windows, not on macOS. In addition to the MenuFlyoutItem element, there is also the MenuFlyoutSeperator for displaying a separator line and the MenuFlyoutSubItem element for defining submenus.

By the way, the new ToolTips are an elegant way to discreetly inform the user that a context menu can be opened. Just like context menus, ToolTips can be added to any screen element, as shown in Listing 3.

Listing 3

<Grid RowDefinitions="25, auto" 
  ToolTipProperties.Text="Open context menu with right click">
  <Label Text="{Binding Time}" />
  <Label Text="{Binding Title}" Grid.Row="1" FontSize="Subtitle" FontAttributes="Bold"/>
  <FlyoutBase.ContextFlyout>
    <MenuFlyout>
      <MenuFlyoutItem Text="Favorite" Command="{Binding FavoriteCommand }" />
        <MenuFlyoutItem Text="Open in a new window" Command="{Binding OpenNewWindowCommand }" >
        <MenuFlyoutItem.IconImageSource>
          <FontImageSource FontFamily="FA-6-Solid...