May 10th, 2022

.NET MAUI Release Candidate 3

David Ortinau
Principal Product Manager

We are excited to release .NET Multi-platform App UI (.NET MAUI) Release Candidate 3 with a new batch of improvements. As with previous release candidates, RC3 is covered by a “go-live” support policy, meaning .NET MAUI is supported by Microsoft for your production apps.

.NET Multi-platform App UI install workload

To get started with .NET MAUI, install or upgrade to the latest Visual Studio 2022 preview and select the “.NET Multi-platform App UI development” workload. This will install all the .NET 6 pieces you need, plus enable preview features to make your .NET MAUI development experience more productive.

For guidance on migrating Xamarin libraries to .NET 6 and .NET MAUI, checkout these tips on the Xamarin blog, and the May .NET MAUI Community Standup where Brandon Minnick discussed moving the Xamarin Community Toolkit to .NET MAUI.

Focus on Navigation

.NET MAUI provides you with 2 primary ways to implement navigation in your applications. The easiest yet power option is running your app in Shell which provides details optimized for both desktop and mobile patterns. The second option is to use the base navigation page controls directly: FlyoutPage, TabbedPage, and NavigationPage.

Shell Base Controls
Flyout Yes Yes
Tabs Yes Yes
Navigation URI Based Push/Pop
Passing Data URI Based View Models
Template-able Yes No

What should you use? The .NET MAUI new project template implements Shell and provides an optimized experience, so we recommend you start with that one. If in the future you want to swap out for specific controls, you can still reuse all your UI. Shell is a UI control that hosts your app pages and offers flyout and tab menus.

The template project includes an “AppShell.xaml” with a single page, and this is assigned to the App.MainPage. To see the flyout come to life, simply add more pages and enable the flyout by changing the Shell.FlyoutBehavior.

<Shell
    x:Class="MauiApp2.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:MauiApp2"
    Shell.FlyoutBehavior="Flyout">

    <ShellContent
        Title="Home"
        ContentTemplate="{DataTemplate local:MainPage}"
        Route="MainPage" />

    <ShellContent
        Title="Items"
        ContentTemplate="{DataTemplate local:ItemsPage}"
        Route="ItemsPage" />

</Shell>

basic Flyout example images

ShellContent enables you to describe the URI routes for navigation, and to use data templates so your pages are loaded on-demand to preserve your startup performance. To be more explicit, you can wrap the ShellContent in navigation aliases that instruct Shell clearly how to render your UI.

<FlyoutItem Title="Home" FlyoutIcon="home.png">
    <ShellContent ...>
</FlyoutItem>

<FlyoutItem Title="Items" FlyoutIcon="store.png">
    <ShellContent ...>
</FlyoutItem>

Shell supports many customizations of the flyout including styling the background, backdrop covering the content, templating the header, footer, entire content, or just the menu items. You can also set the width of the flyout and keep it open or hide it altogether. Here are some examples of just a few different designs:

gallery of flyout examples

To display tabs, you can just replace FlyoutItem with Tab. To group collections of tabs you can wrap them further in a TabBar. Mix and match the pages of your app however you need, and Shell will do all of the navigation for you.

For more information on customizing flyout and tabs check out the Shell flyout and Shell tabs documentation.

When you need to navigate to pages deeper in your application, you can declare custom routes, and navigate by URI — even pass querystring parameters.

// declare a new route
Routing.RegisterRoute(nameof(SettingsPage), typeof(SettingsPage));

// execute a route
await Shell.Current.GoToAsync(nameof(SettingsPage));

// execute a route passing data
await Shell.Current.GoToAsync($"{nameof(SettingsPage)}?setting=appearance");

// receive querystring value
[QueryProperty(nameof(SelectedSubSection), "setting")]
public partial class TipsPage : ContentPage
{
    ...
    public string SelectedSubSection { get;set;}
    ...
}

In addition to parameters, you can pass complex data objects through a new API introduced with .NET MAUI:


// execute a route passing full object
var person = new Person { Name="James" };
await Shell.Current.GoToAsync("DetailsPage", new Dictionary<string, object>
{
    { "person", person }
});

// received the object
[QueryProperty(nameof(Person), "person")]
public partial class DetailsPage : ContentPage
{
    Person person;
    public Person Person
    {
        get => person;
        set => person = value;
    }
}

Check out the .NET MAUI Workshop for more examples.

The QueryProperty attribute routes the incoming querystring parameter to the public property provided. You can also do this with a view model when implementing the MVVM pattern.

For more information on navigating with Shell check out the Shell documentation.

Get Started Today

To acquire .NET MAUI RC3 on Windows, install or update Visual Studio 2022 Preview to version 17.3 Preview 1. In the installer, confirm .NET MAUI (preview) is checked under the “Mobile Development with .NET” workload.

To use .NET MAUI RC3 on Mac, follow the command-line instructions on the wiki. Support for .NET MAUI in Visual Studio 2022 for Mac will ship formally in a future preview.

Release Candidate 3 release notes are on GitHub. For additional information about getting started with .NET MAUI, refer to our documentation and the migration tip sheet for a list of changes to adopt when upgrading projects.

Reminder about Xamarin support The Xamarin Support Policy is still in effect, which covers those products for 2 years after initial release. The last release was in November of 2021, so support will continue through November 2023.

We need your feedback

Install the latest preview of Visual Studio 2022 for Windows (17.3 Preview 1) following our simple guide and build your first multi-platform application today.

We’d love to hear from you! As you encounter any issues, file a report on GitHub at dotnet/maui.

Author

David Ortinau
Principal Product Manager

David is a Principal Product Manager for .NET at Microsoft, focused on .NET MAUI. A .NET developer since 2002, and versed in a range of programming languages, David has developed web, environmental, and mobile experiences for a wide variety of industries. After several successes with tech startups and running his own software company, David joined Microsoft to follow his passion: crafting tools that help developers create better app experiences. When not at a computer or with his family, David ...

More about author

29 comments

Discussion is closed. Login to edit/delete existing comments.

  • jamal ibrahim

    Migration from Xamarin Forms to .NET MAUI

    In My current project, all of my projects Libraries are in PCL format(Target Framework – .NET Portable) only. I have few questions related to .NET MAUI Migration.

    Question 1: Do I need to convert those library projects into .NET Standard – Target Framework before migrating to .NET MAUI? or it is not necessary to convert those chances.

    Question 2: Xamarin Forms PCL to .NET MAUI migration, will it be supported directly?

    Read more
    • jamal ibrahim · Edited

      @David Ortinau Hi, could you please answer the above questions?

  • Enoch Affanyi · Edited

    Where is Microsoft.Maui.Essentials in this RC3 release @David. trying to use some Preferences API and can’t seem to find them.

  • Derek Creech

    Is there a MAUI equivalent to Xamarin.Forms.Map? That allowed you to bring up a map view inside the app.

    All I’m seeing with MAUI is Essentials.Maps which opens a separate map application.

  • Paul Graham

    Is there a Image size guide for MAUI, in particular I'm trying to work out what size image I should used for the shell/app action icon sizes. I've got the swf, just need to know what is the default size. Also I'm trying to access a file in the AppDataDirectory, I added to the Raw folder but I can't see it. I've manage this with xamarin with the following, but it looks like you're making...

    Read more
  • ruben dario rueda pineda

    Hello!
    I would like to know if I can use the mmvm pattern when applying the shell.

    • Jan Seriš

      of course

  • Kevin Marois · Edited

    At the start of this blog you said “To get started with .NET MAUI, install or upgrade to the latest Visual Studio 2022 preview and select the “.NET Multi-platform App UI development” workload.”…

    The “.NET Multi-platform App UI development” workload does not appear in my VS installer. I have updated both the installer, and VS to 17.2.

    What’s wrong here??

  • Virchar Bautista

    yea, by using VPN located in US I may able to update.

  • Simon Brettschneider

    I can’t wait to try out RC3, but unfortunately, the installer is stuck in “Checking for updates” and I can not proceed. Are you experiencing the same problem?

    • David OrtinauMicrosoft employee Author

      These could all be related to CDN issues I saw reported yesterday impacting our packages. Please try again.

      • Martin Rothschink

        Does not help, still no download possible. Please investigate and fix.

      • Dani Shitrit · Edited

        Hi David,
        I’m in RC2, how the shell will influence when converting the app to RC3?

        I didn’t use Shell before.

    • Koji Nishimoto

      Same here.

    • Tom Dacquin

      Same here, ready to get started but can’t install

    • cupsos

      Same issue here. But after changed IP address in US by VPN, it worked

    • Maggidi Rakesh

      The installer is stuck in “Checking for updates” and I can not proceed , is the same problem for me as well

    • Romuald Sicard

      Same here, no more luck via “dotnet workload install maui”

      • Romuald Sicard

        Finally updated via VS Installer…

  • Max Mustermueller

    There are so many major issues, please keep focusing on fixing them first. For example on Android images aren't shown either when loading from file / resources (at runtime) or when downloading from an URL. Also you cannot debug iOS either on mac or using remote connection to mac (because VS tells me the iphone simulator is currently broken pointing to a VS ticket which is about Xamarin). On iOS all I get is a...

    Read more
    • David OrtinauMicrosoft employee Author

      Android images were fixed last release. Please confirm you have the latest .NET MAUI workload installed, and file an issue on GitHub if this is still happening to you.

      iOS debugging is working in Visual Studio 17.3 Preview 1. These issues sound to me like you have a corrupted environment. I recommend uninstalling, cleaning up your VS and .NET cache folders, and reinstalling.

      I'll add a note about ARM64 to make that more clear, thanks.

      Read more
      • Max Mustermueller · Edited

        David, just for the records, I just started with MAUI RC2. I never had MAUI experience before. On Android images aren't loading. You cannot style the popup dialog, the official tutorial for ImageButton pressed animation is incorrect, Listview items are still enabled even if Listview is disabled (also user can use the pull to refresh when listview is enabled) and these are just the issues I found myself within a week doing the easiest things....

        Read more
      • anonymous

        this comment has been deleted.

    • Burkhardt, José

      You got to wait until Visual Studio 2022 is fully supporting .NET MAUI. I think it was David Ortinau who mentioned in another blog post that Visual Studio 2022 won't support .NET MAUI with the GA release. Better wait for the Microsoft BUILD conference. I am sure they will announce more information there. And for now please don't forget that you are using .NET MAUI Release Candidate 3 and not a final release. Same...

      Read more
      • Jan Seriš

        Images not working on Android is not an issue with Visual Studio supporting MAUI. It just doesn’t work in MAUI.

    • anonymous

      this comment has been deleted.