Introducing .NET Multi-platform App UI

Scott Hunter [MSFT]

Scott

You can build anything with .NET. It’s one of the main reasons millions of developers choose .NET as the platform for their careers, and companies invest for their businesses. With .NET 5 we begin our journey of unifying the .NET platform, bringing .NET Core and Mono/Xamarin together in one base class library (BCL) and toolchain (SDK).

As we consider what building device applications will look like in a unified .NET, we see many devices across multiple platforms used, from Android and iOS to Windows and macOS. To address this need we are excited to announce a new first-class UI framework for doing just that: .NET Multi-platform App UI, affectionately called .NET MAUI.

Let us introduce you to what .NET MAUI is, the single project developer experience, modern development patterns, and a look at the journey ahead.

MAUI overview

What is .NET MAUI

.NET MAUI is an evolution of the increasingly popular Xamarin.Forms toolkit that turns 6 years old this month. For years companies such as UPS, Ernst & Young, and Delta have been leveraging the mobile expertise of Xamarin atop .NET to power their businesses; some since the very beginning. It has also been very successful in helping small businesses maximize their development investment sharing upwards of 95% of their code, and beating their competitors to market. .NET MAUI extends this success on mobile to embrace the desktop making it the best way to build multi-platform applications across both, especially our new devices such as the new Surface Duo.

.NET MAUI simplifies the choices for .NET developers, providing a single stack that supports all modern workloads: Android, iOS, macOS, and Windows. The native features of each platform and UI control are within reach in a simple, cross-platform API for you to deliver no-compromise user experiences while sharing even more code than before.

Single Project Developer Experience

.NET MAUI is built with developer productivity in mind, including the project system and cross-platform tooling that developers need. .NET MAUI simplifies the project structure into a single project to target multiple platforms. This means you can easily deploy to any target that you wish including your desktop, emulators, simulators, or physical devices with a single click. With built-in cross-platform resources you will be able to add any images, fonts, or translation files into the single project, and .NET MAUI will automatically setup native hooks so you can just code. Finally, you will always have access the native underlying operating system APIs and it will be easier than ever with new platform specific integrations. Under platforms you can add source code files for a specific operating system and access the native APIs. With .NET MAUI everything is in one place where you need it to keep you productive.

.NET MAUI Single Project

This delivers:

  • One project targeting multiple platforms and devices
  • One location to manage resources such as fonts and images
  • Multi-targeting to organize your platform-specific code

You master one way to build client apps, the .NET MAUI way, and all platforms are within your reach. Today, Scott Hanselman and I will demo it in action at Build, The Journey to One .NET.

Modern App Patterns

Part of the vision for one .NET is providing developer choice in the areas of personal preferences so you can be most productive using .NET. This manifests in which IDE you use whether Visual Studio 2019, Visual Studio for Mac, or even Visual Studio Code. .NET MAUI will be available in all of those, and support both the existing MVVM and XAML patterns as well as future capabilities like Model-View-Update (MVU) with C#, or even Blazor.

MVVM

Model-View-ViewModel (MVVM) and XAML, the predominant pattern and practice among .NET developers for decades now, are first-class features in .NET MAUI. This will continue to grow and evolve to help make you productive building and maintaining production apps.

<StackLayout>
    <Label Text="Welcome to .NET MAUI!" />
    <Button Text="{Binding Text}" 
            Command="{Binding ClickCommand}" />
</StackLayout>
public Command ClickCommand { get; }

public string Text { get; set; } = "Click me";

int count = 0;

void ExecuteClickCommand ()
{
    count++;
    Text = $"You clicked {count} times.";
}

MVU

In addition, we are enabling developers to write fluent C# UI and implement the increasingly popular Model-View-Update (MVU) pattern. MVU promotes a one-way flow of data and state management, as well as a code-first development experience that rapidly updates the UI by applying only the changes necessary. For more information about MVU as a pattern, check out this Elm Programming guide and this blog from Thomas Bandt.

Below is a basic counter example in the MVU style written in .NET MAUI.

readonly State<int> count = 0;

[Body]
View body() => new StackLayout
{
    new Label("Welcome to .NET MAUI!"),
    new Button(
        () => $"You clicked {count} times.",
        () => count.Value ++)
    )
};

This pattern is ideally suited for hot reload as you can see below with added styling, gradients, and fonts with instant hot reload from C#.

MAUI model-view-update

Both MVVM and MVU deliver the same native applications, performance, and platform fidelity. Developers will be able to choose which style best suits their preference and use case.

Transitioning from Xamarin.Forms to .NET MAUI

Xamarin.Forms developers will hit the ground running with new projects in .NET MAUI, using all the same controls and APIs they have grown to know and love. As we get closer to the .NET MAUI launch, In order to help developers make a smooth transition of existing apps to .NET MAUI we intend to provide try-convert support and migration guides similar to what we have today for migrating to .NET Core.

The .NET MAUI Timeline

We will begin shipping .NET MAUI previews later this year, and target general availability with .NET 6 in November of 2021. .NET MAUI will ship on the same 6 week cadence that Xamarin.Forms has been on. We have published the .NET MAUI roadmap on GitHub and invite you to join us there today!

What’s Next for Xamarin and Xamarin.Forms

As part of our .NET unification, Xamarin.iOS and Xamarin.Android will become part of .NET 6 as .NET for iOS and .NET for Android. Because these bindings are projections of the SDKs shipped from Apple and Google, nothing changes there, however build tooling, target framework monikers, and runtime framework monikers will be updated to match all other .NET 6 workloads. Our commitment to keeping .NET developers up-to-date with the latest mobile SDKs is foundational to .NET MAUI and remains firm. When .NET 6 ships, we expect to ship a final release of Xamarin SDKs in their current form that will be serviced for a year. All modern work will at that time shift to .NET 6.

Xamarin.Forms will ship a new major version later this year, and continue to ship minor and service releases every 6 weeks through .NET 6 GA in November 2021. The final release of Xamarin.Forms will be serviced for a year after shipping, and all modern work will shift to .NET MAUI.

Get Involved Today

Join us on this journey to .NET MAUI at our brand new repository dotnet/maui. Be sure to star and watch to get notifications, then join in the discussion of proposals describing how we want to evolve the code base. This is the very beginning of a long journey welding Xamarin and Xamarin.Forms directly into the heart of .NET, and we are excited to do this in the open with you.

165 comments

Comments are closed. Login to edit/delete your existing comments

  • Avatar
    Anand C

    I would prefer simpler name like .NET UI or Xaml UI.

    Please include a UI Designer with preview on various Devices (Desktop, Mobile, web with Responsive design) that is targeted by the project.

    In order to have one unified UI Framework, MS should also look at using Xaml as replacement for Blazor components/applications rather than razor syntax with html markup. Let the MSBUILD convert the xaml representation into whatever that’s required to convert them into equivalent html5/css3 standards. There should only one language for constructing the UI that’s Xaml based on WPF style development (all features of WPF including ability to author custom components/controls, triggers, visual state managers, bindings, MVVM…etc)

    • Avatar
      Eduard Kagan

      Dude, no one cares about Windows 7. You’ve got to be out of your mind if you think there are “millions of devs” as you stated elsewhere coding on Win 7. It got end-of-lifed on 01/14/2020, why would MS waste time and resources to support it???

      • Avatar
        justforbuild@outlook.de

        There is still a significant user-base for Win7, obviously.

        Win10 is still a privacy nightmare, with tracking and data collection, instead of respecting the wish of users to keep their private data. It can be fully disabled (with a lot of effort) for Enterprise, but not for Professional nor Home.

  • Avatar
    Nawfal Hassan

    So now there is

    1. MAUI (Xamarin.Forms),
    2. Xamarin.iOS and Xamarin.Android,
    3. UWP (windows specific)
    4. Other open source projects like Uno

    Not counting the WinUI which is just a UI library compatible with both Win32 and UWP. I wonder how they all relate. Too much platforms to remember. I hope this madness stops with MAUI. Is MAUI with WinUI the future? Not so hopeful, is XF/MAUI based XAML even compatible with WinUI?

    • Avatar
      David OrtinauMicrosoft employee

      Hi Nawfal,

      Xamarin.Forms uses WinUI2 today with its current XAML. As with all platforms, we will guide our support based on developer demand and required device targets.

      You write your UI once in .NET MAUI and you can target Android, iOS, macOS, and Windows.

      • Avatar
        Nawfal Hassan

        @David, great, thanks for the reply. Hmm I like it where it stands now. So I will consider these for future development:

        1. MAUI with its XF/WinUI2 XAML (what i like about it is it being architecture pattern agnostic – either MVVM or MVU)
        2. Uno with its WinUI3 XAML

        Will play around and decide.

  • Avatar
    Max Mustermueller

    How is this different to Xamarin? With Xamarin we can do the same, as far as I can see. XAML + no Linux support + one code for different platforms (mostly mobile), at the cost of larger applications and performance penalties when targeting Windows comparing to WPF/Winforms. MAUI doesn’t seem to fill the gaps, nor does it have something outstanding for desktop developers to use it instead of WPF/UWP/Winforms.

    At this moment I’m not that much excited, I’m sorry.

    • Michal Dobrodenka
      Michal Dobrodenka

      You mean Xamarin.Forms? Because Xamarin is technology to run c# on mobile platforms. For UI you can use native iOS/Android controls or using Xamarin.Forms you can create multiplatform UI. But you don’t have to use Xamarin.Forms in Xamarin (I don’t)

      MAUI is successor to Xamarin.Forms

  • Avatar
    Jacques Doubell

    So with this new layout language, how do you control size and positioning of elements? At least with xaml you have a clear separation between ui and logic. Like someone else already mentioned, this seems a lot like how Flutter does things.

    • Avatar
      David OrtinauMicrosoft employee

      Hey Jacques,

      In the C# fluent style here you still have layout controls. I believe in this example I showed ZStack and VStack which or specialized StackLayouts. Grid and FlexLayout are great options as well, and we do have AbsoluteLayout and RelativeLayout.

      We are at the beginning of this journey, and would love you to engage with us at dotnet/maui as we get rolling.

      btw – you can still separate UI and Logic while using C# only. We haven’t prototyped that specifically with this MVU, but we do have this today using the new C# markup extensions.

  • Avatar
    Moreno Gentili

    Well… a 5/5 for the effort but I personally would have preferred an HTML-based UI framework, driven by a C# implementation of jsdom.
    I do like XAML but… I don’t know, it feels like a relic from the past.

    • Avatar
      justforbuild@outlook.de

      HTML is an awkward extension of a text markup for developing apps. XAML was meant for apps all the time, though could use an update to add type safety, dearly, among a simplification of a few binding tasks, that are cumbersome.

    • Avatar
      David OrtinauMicrosoft employee

      Hi Moreno,

      I think this whole thread of comments demonstrates how diverse in preferences our developer community is while still unifying on .NET as a platform. Pretty amazing.

      That illustrates why we not only support XAML in .NET MAUI, but are also introducing a C# MVU style, and we are collaborating on experiments like Mobile Blazor Bindings for devs that prefer HTML and Razor.

      • Avatar
        Matthew Vigg

        The collaboration on mobile blazor bindings is good to hear – would the (long term) aim be to have the bindings sit on top of what you’re doing here? In other words we could use razor components and have them work in server or client side blazor as well as via Maui…?

        Not expecting that anytime soon but I’m very interested in the fact the blazor bindings exist so it would be a shame if Maui was in competition with them.

    • Avatar
      Stephen York

      Umm… XAML only hit market in 2008. HTML is the relic from the past. I only learned WPF recently from an extremely good video based training resource showing well thought through techniques and any other approach now seems feeble in comparison. I love Xamarin which already has XAML and the fact that more development is being put into this makes me very happy. MAUI to me doesn’t look like an entirely new technology but rather a good evolution and improvement on something that most of us already know. People have been pushing app dev using pure html in SPA frameworks but I’ve never been sold on that being the way forward. I welcome this platform and an’t wait to get into it.

  • Avatar
    Dominik Jeske

    How MAUI relates to WinUI 3 – are those completely separate efforts one for multiplatform and second for modern windows or they will meet in some point?

    • Avatar
      David OrtinauMicrosoft employee

      Hi Dominik,

      You’re on the right track, .NET MAUI is as the name says Multi-platform App UI. It is also native UI, so on Windows it uses the implementation developers need for the devices they are targeting.