Telerik blogs
7ThingsMaui-870x220

.NET Multi-platform App UI (MAUI) is the next evolution of cross-platform UI solution for .NET developers. Just like the island, MAUI will have plenty to offer for developers. Let's explore the promise of .NET MAUI .

Maui—the paradise on Earth. Nicknamed the Valley Isle, Maui is the second-largest Hawaiian island and has a lot to offer. Maui boasts of some pristine, world-famous beaches and amazing ocean life under the water surface. That's not all though. Maui is host to a massive volcano, high mountains and breathtaking waterfalls. With a wide variety of weather systems and top notch culinary scene, Maui is a true gem among the Hawaiian archipelago. Maui epitomizes the Aloha spirit and offers something for everybody.

 

DotNetBotMaui  

There is another Maui that is plenty exciting as well—the .NET MAUI framework. .NET is already well positioned to allow developers to target a wide variety of app platforms and polished tooling. However, .NET is in need for some unification and the time is ripe to roll out a consistent first-class UI framework for variety of platform needs. Enter the evolution of cross-platform .NET stack—the Multi-platform App UI, affectionately called .NET MAUI. While in its early days, .NET MAUI already promises new tooling, a unified framework and more flexibility for developers. Let's explore the top seven things to enjoy in MAUI—lots of similarities between the island and the framework.

Haleakala Chopper Tours

Maui has a lot to offer. Even with high enthusiasm, there are limits to how much one can see while on land in Maui. There will be the upstream mountainside waterfalls you'll miss or the grandeur of the Haleakala Crater. To get a bigger picture of Maui, one has to fly with the birds. A lot of Maui's beauty is often best captured from air and popular helicopter tours may just make your flight worth it. Traveling inter-island is also a big part of life in Hawaii and smaller scenic plane flights provide excellent opportunities to take in the vistas.

As with the island, one cannot appreciate .NET MAUI without the bigger picture in mind. While modern .NET allows developers to target a variety of platforms, developers do see a bit of fragmentation in the framework and differences in tooling. There are several popular .NET base class libraries (BCLs)—like .NET Framework. .NET Core, Mono, Unity etc., each of which caters .NET to specific app models/platforms. While .NET MAUI tools ship with .NET 6 in Nov 2021, it would surely ride the benefits of .NET 5, expected later in 2020. .NET 5 sees a unification story for all .NETs, combing the best of .NET Core and Mono. With .NET 5, developers get a single trustworthy open source .NET with polished cross-platform tooling to build all types of apps—Windows, Linux, MacOS, iOS, Android, WebAssembly and more.

DotNet5

.NET MAUI is positioned to be the next evolution of Xamarin.Forms—with added confidence, additional platform support and better tooling. In addition to iOS/Android mobile platforms, .NET MAUI adds support for desktop platforms, namely Windows and MacOS, as well as supporting upcoming dual screen devices. In essence, .NET MAUI  promises to be the single stack UI framework for .NET developers aiming for cross-platform workloads—truly native apps from a single code base. .NET MAUI would be an integral part of the overall .NET story, alluring developers with platform reach and polished tooling.

MauiOverview

Honokalani Black Sand Beach

When you embrace differences, you often find something enriching. Sure Maui offers plenty of amazing beaches with silky smooth white sand to soak up the tropics. But step off the beaten path towards Hana and you'll find a beautiful black sand beach—mystical dark pebbles redefine what a beach can be. On the hike down to Honokalani black sand beach, you also find hidden caves, giant splashing water holes and amazing views.

Xamarin has been a wonderful solution for .NET developers going cross-platform and the Xamarin.Forms UI stack is defined in XAML. Serious developers shipping Xamarin.Forms apps have often resorted to MVVM (Model-View-ViewModel), a common design principle for code sanity. .NET MAUI will offer developers the same C#/XAML experience with support for various MVVM frameworks. Here's how developers have traditionally hooked up a button counting clicks in Xamarin.Forms—perfectly welcome in .NET MAUI.

<StackLayout>
    <Label Text="Hello World!" />
    <Button Text="{Binding Text}" Clicked="Binding ClickCommand" />
</StackLayout>

public ICommand ClickCommand { get; }
public string Text { get; set; } = "Click Counter";

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

However popular C#/XAML/MVVM may be for Xamarin.Forms developers, it would be myopic to think all developers want to do the same thing. In fact, one of the goals with .NET MAUI is to open the funnel and invite developers with variety of mindsets into the fold. Another popular design pattern is MVU (Model-View-Update), favored by lots of React Native or Flutter developers. 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. .NET MAUI would enable developers to write fluent C# UI to build the visual tree and utilize the MVU pattern to hook things up—actual implementation would likely be a spin-off from the popular Comet UI framework. Here's the same button click counter:

public class MainPage : View
{
    readonly State<int> count = 0;
    readonly State<string> text = "Hello World!";

    [Body]
    View body() => new VStack
    {
        new Text(text)
                .FontSize(32),
        new Button("Increment", () => state.Text = $"Click Count: {clickCount.Value++}")
                .Background(Color.Blue)
                .Color(Color.White)
    };
}

For .NET web developers, Blazor's popularity is through the roof and for good reason. After a long wait, Blazor is fully ready for WebAssembly—developers can write C# front/back and enjoy native web performance. Wouldn't it be cool to reuse Blazor knowledge to build native mobile apps over Xamarin.Forms? That's the goal of Experimental Mobile Blazor Bindings—to bring in the familiar web programming patterns into native cross-platform mobile land. Keep in mind though, there is no WASM play here—what's simply being used is the Razor syntax to render native UI and the React-like Blazor component model. There is a good chance that .NET MAUI may gain the Blazor way of rendering UI—here's the button click counter:

<StackLayout>
    <Label Text="@("You clicked" + count + " times.")" />
    <Button Text="Increment" OnClick="@HandleClick" />
</StackLayout>

@code {
    int count;

    void HandleClick()
    {
        count++;
    }
}

Snorkeling in Molokini

Much of the beauty of Maui lies under the ocean surface. From Maui's popular south shore, boat trips take folks out to a little underwater paradise—the Molokini crater. This crescent shaped tiny island and its surroundings provide a natural habitat to a vast variety of ocean life. Go beneath the surface and you get world class snorkeling experiences. And you might just catch a glimpse of something incredible on your way to/back from Molokini—the mighty Humpback whale.

Similarly, much of what to appreciate about .NET MAUI lies under the surface. Combining the best of .NET Core/Mono and providing a well balanced UI stack is not a small feat. Thanfully, there are some big benefits for developers to look forward to. For the first time, Xamarin aka MAUI developers get CLI (Command Line Interface) tools, in line with the rest of modern .NET. This would mean both visual and command line ways of doing common things—like scaffolding projects, resolving dependencies, building and deploying to devices/simulators. Support for CLI tools has two big implications:

  1. Use of 'dotnet build' tools over MSBuild
  2. Visual Studio Code support

Yes, you read that right. In addition to Visual Studio on Windows and Visual Studio for Mac on MacOS, developers would be able to leverage VS Code for .NET MAUI app building. A lot of developers would prefer the lightness of VS Code as an editor, with all the benefits of code intelligence and deploying apps through CLI commands/VS Code Command Palette.

Need to upgrade Xamarin.Forms apps to .NET MAUI? This will likely not be a difficult process, with try-convert type tooling being promised. Two big Namespace changes to keep in mind:

Xamarin.Forms --> System.MAUI

Xamarin Essentials --> System.Devices

Another huge promised benefit of .NET MAUI would be simplified tooling for developer productivity. Even though you may be building a truly native cross-platform app, your .NET MAUI would be a single point of inspiration—a single SDK-style project. Gone would be platform-specific projects to manage images/resources/fonts for each target platform—.NET Maui projects would share them all and just be smarter during builds. Target Framework Monikers (TFM) would dictate which platforms are supported and multi-targeting would help organize platform-specific code. .NET MAUI will sport a single project for all supported platforms—simple to deploy seamlessly to iOS/Android/Windows/MacOS & more.

MauiSingleProject

Road to Hana

One of the most beautiful parts of Maui is Hana, a mythical land of mountains, waterfalls, history and legends. And the best part of visiting Hana is often the journey—the road to Hana is an incredible drive through twisted roads, breathtaking views and lush rainforest weather. Sure it takes time and you will be enticed to make a lot of stops along the way, but the experience is so worth it.

.NET MAUI holds a lot of promise towards a top-notch consistent UI framework for .NET developers to build cross-platform native apps for mobile and desktop. The high ground comes at a price though—it would be a long, sometimes painful, winding road to the top. .NET MAUI ships with .NET 6, making the present very early days. And of course, .NET MAUI would be entirely open sourced. While developing a UI framework with full transparency is much appreciated by the developer community, there are a lot of opinions to take into consideration out in the open source world. For .NET MAUI to meet everyone's needs, some architectural decisions would need to be made along the way that showcase the balance of respecting community opinions and streamlining tooling for developer productivity.

One very contentious point is XAML (extensible application markup language)—arguably the most popular way of defining the UI visual tree in .NET MAUI. As an evolution of Xamarin.Forms, C#/XAML feels very natural in MAUI and would offer developers the same productivity boost with quality tools. However, the specific flavor of XAML is being debated. Turns out, Xamarin.Forms uses a dialect of XAML that heavily caters to mobile development, and as such is different from the more feature-rich traditional 'Windows' XAML powering WPF/UWP/WinUI platforms. There are community requests to merge the XAML flavors, but this will likely not be an easy endeavor. There are also open questions the .NET MAUI team needs to address about stability, tooling differences with other XAML ecosystems, and ease of customizing custom UI components. A lot of tooling and guidance also needs to be built around the C# MVU pattern or potentially the Blazor way of rendering a visual tree. Code needs to be less verbose and documentation needs to be solid. The good news is, these are super early days for .NET MAUI—the community and engineering teams have the time to do things right. As Hana Maui shows us, it's sometimes not just the destination—the journey can be equally enriching.

Lahaina Sunrise & Sunsets

Maui runs on island time. The sense of panic is often replaced by slowing down to do things right. And few other experiences capture the Hawaiian spirit more than watching sunrises and sunsets from the village of Lahaina. As the gentle ocean waves lap on soft sand beaches and a cool breeze relaxes your soul, you realize it is OK to let go of today. Tomorrow's sunrise brings in fresh promise and zest for life to move forward.

For the past decade, Xamarin technologies have been adored by countless developers. For .NET developers, Xamarin has always provided one of the easiest ways to make cross-platform apps and share code. Without the magic of Mono under the covers and Xamarin's platform reach, .NET developers would not have been able to take their code places, like iOS, Android, Tizen, WPF, MacOS, Linux and more. Sure there have been platform/tooling challenges; but armed with a commitment to make developers successful, the Xamarin teams and the community have always rallied together to make things better. With the advent of .NET MAUI, some may be sad to see the sunset for the beloved Xamarin brand.

But fear not—the next sunrise is just going to be better. In a testament to Xamarin's engineering efforts, much of Xamarin is now being rolled up into the core of .NET and provides more developer confidence.

Xamarin.iOS --> .NET for iOS

Xamarin.Android --> .NET for Android

Since the Native Xamarin is essentially a shim over native APIs to use shared C# code, nothing much needs to change—simply use within .NET and with preferred tooling. Xamarin.Forms evolves into .NET MAUI and gains additional platform support. In addition to iOS/Android, developers will be able to build native desktop apps for Windows and MacOS—a result of maturity of tooling and confidence in platform support.

MauiPlatformSupport 

The 50th State

Hawaii became the 50th state of the United States of America in 1959. Part of the Polynesian subregion of Oceania, Hawaii is the only island state in U.S. Aside from the strategic advantage in the Pacific ocean, Hawaii's statehood has relaxed consequences for Americans—freedom of movement for island and mainland residents alike. No passports needed. Currency, language and general way of life is the same. What you are used to just works—only with added flair.

Similarly, .NET MAUI is just part of .NET. All your tools just work. All your development experiences just carry forward. The funnel is being widened to include more ways of building the cross-platform UI stack.

Use something in Xamarin today and have concerns for tomorrow? What if you were using polished performant UI components, like Telerik UI for Xamarin? Relax. It will all evolve and work seamlessly in .NET MAUI. Fond of the Blazor component model to build native cross-platform mobile apps? Telerik UI for Xamarin already offers experimental Blazor bindings for rendering flexibility. Everything from Telerik UI for Xamarin will work tomorrow—just better.

Relief 

The Aloha Spirit

Aloha is the Hawaiian word for love, affection, peace, compassion and mercy. While commonly used as a simple greeting, Aloha has a deeper cultural and spiritual significance to native Hawaiians, for whom the term is used to define a force that holds together existence.

.NET MAUI should be welcomed in the same Aloha spirit. No one is moving your cheese. Tooling and platform support get better. Developers get more flexibility. .NET MAUI is a while away—previews would start showing up end of 2020 with final bits in 2021. But the time to engage is now. Developer community and the .NET MAUI teams have a nice runway to get things right before takeoff. Let's all chill and look forward to a better tomorrow. Aloha!

PS: Most images courtesy of Microsoft.


SamBasu
About the Author

Sam Basu

Sam Basu is a technologist, author, speaker, Microsoft MVP, gadget-lover and Progress Developer Advocate for Telerik products. With a long developer background, he now spends much of his time advocating modern web/mobile/cloud development platforms on Microsoft/Telerik technology stacks. His spare times call for travel, fast cars, cricket and culinary adventures with the family. You can find him on the internet.

Related Posts

Comments

Comments are disabled in preview mode.