Announcing .NET MAUI Preview 4

Image maui weather hero sm

Today we are pleased to announce the availability of .Net Multi-platform App UI (.Cyberspace MAUI) Preview four. Each preview introduces more controls and features to this multi-platform toolkit on our way to general availability this Nov at .Cyberspace Conf. .Internet MAUI at present has enough building blocks to build functional applications for all supported platforms, new capabilities to support running Blazor on the desktop, and exciting progress in Visual Studio to support .NET MAUI.

Weather condition '21

To showcase our progress in Preview 4 for Microsoft Build, we quickly designed and developed a elementary yet beautiful weather app. As we wait for Visual Studio to integrate .Net MAUI productivity features, we began with Xamarin.Forms. We implemented each UI widget and screen with shared styling in a unmarried codebase. Subsequently a few hours, we then ported that piece of work to .Internet MAUI past making a few, small changes such every bit adopting the new Microsoft.Maui namespace. The process was painless and quick!

Image macOS maui

We likewise took the opportunity to prove have easy it is to calorie-free up deep platform integrations by implementing app actions, an icon in the system tray (condition bar), and platform-native notifications all from a single project running on Android, iOS, macOS, and Windows.

individual void SetupAppActions() {     try     {         AppActions.SetAsync(                new AppAction("current_info", "Check Electric current Weather", icon: "current_info"),             new AppAction("add_location", "Add a Location", icon: "add_location")         );     }     grab (System.Exception ex)     {         Debug.WriteLine("App Actions not supported", ex);     } }

Image platform integrations png

Cheque out the WeatherTwentyOne source code here on GitHub, and our demos from Build 2021.

New Features

Progress continues porting controls and layouts from Xamarin.Forms to the .NET MAUI architecture. In this way, .Internet MAUI both is excitingly new and not new at the aforementioned time. We accept learned much over the past 7 years about how to make cross-platform native UI performant and piece of cake to extend, and we are putting that to work here. For ongoing status of this work visit our GitHub status report.

BlazorWebView

The new BlazorWebView enables y'all to host a Blazor web awarding correct in your .NET MAUI awarding and accept advantage of seamless native platform features and UI controls. The command tin can be added to any XAML page and pointed to the root of the Blazor application.

<BlazorWebView      HostPage="wwwroot/index.html"     Services="{StaticResource Services}">     <BlazorWebView.RootComponent>         <RootComponent              Selector="#app"             ComponentType="{x:Blazon local:Main}"         />     </BlazorWebView.RootComponent> </BlazorWebView>

For a deeper wait at this powerful integration, read more than on our ASP.Net blog.

Splash Screen

On mobile platforms particularly you want your kickoff screen to appear as quickly every bit possible, and this is done by implementing a static splash screen. .NET MAUI now has a unmarried place to describe your splash screen for all platforms that back up them.

<MauiSplashScreen Include="Resources\appiconfg.svg" Color="#512BD4" />

Image splash screens

Any image format may be provided along with a background brush, similar to how we also do app icons. For more advanced scenarios, platform-native splash screen methods all all the same apply.

Raw Assets

.NET MAUI now makes it very easy to add other avails to your projection and reference them straight while retaining platform-native performance. For example, if you want to display a static HTML file in a WebView you can add the file to your project and comment it as a MauiAsset in the properties.

<MauiAsset Include="Resources\Raw\index.html" />

Tip: you lot can also utilize wildcards to enable all files in a directory: Include="Resource\Raw\*"

Then yous can use it in your application by filename.

<WebView Source="alphabetize.html" />

Visual Studio Productivity

In Visual Studio 16.11 Preview ane we get a offset await at the productivity features for .Cyberspace MAUI including new run options for a multi-targeted single project, and the all-new .NET Hot Reload for editing your managed code.

Single Project Run

Single Project introduces a new feel for selecting the target platform and device when running your .Cyberspace MAUI applications. These changes simplify the startup process and give you admission to all the platforms and devices in a single place.

For Unmarried Project, platform-specific application projects are no longer within the solution, thus you will no longer correct-click on a project to set it equally the startup projection.

In the new target debug selector, yous will select the platform you are targeting start. Later on selecting your target platform, you volition be given the list of devices you can run your .Net MAUI application on. All of this will be accessible through the Run Bill of fare when y'all take a .NET MAUI Unmarried Projection.

Image run static profiles

The new run menu is the first of a host of changes within Visual Studio to support Unmarried Projection applications. We'll be announcing new features in the upcoming releases, so keep an eye out for updates!

.NET Hot Reload

.NET Hot Reload is a new experience that enables you to make live edits to your .NET MAUI app's source code while it is running, reducing the number of times you need to rebuild your app.

To offset testing this feature install both .Internet 6 Preview 4 and Visual Studio 2019 version 16.11 Preview one. Start your app through the Visual Studio debugger (F5) targeting a WinUI 3 host. Once your app is running, you'll now have the new option to make code changes and employ them using our new "apply code changes" push as illustrated below.

Image dotnetmaui hotreload winui preview

In coming releases .NET Hot Reload will also be available for Android, iOS, and macOS, and we'll exist integrating XAML Hot Reload and the Alive Visual Tree as well.

To learn more about Hot Reload cheque out Introducing .Net Hot Reload.

Ecosystem Readiness

Image telerik maui

One of the major advantages of using .Net is leveraging a rich ecosystem of controls and libraries for building apps. With Preview four the Telerik team has released their outset fix of controls for .Net MAUI at https://www.telerik.com/maui-ui. Check out their total annunciation here.

"Since the very early days of .Cyberspace MAUI, our team has been thrilled about the concept behind its multi-platform capabilities! This will be a new era for .Cyberspace developers, and nosotros are excited to partner with Microsoft in this journey." said Stefan Stefanov, Director of Product Management at Progress. "The early preview version of Telerik UI for MAUI provides the .Internet programmer community with professionally designed, characteristic rich UI components to kickstart their cross-platform development and evangelize stunning applications."

Other component vendors are also planning .Net MAUI back up such every bit Syncfusion, DevExpress, and GrialKit.

What about your favorite open up-source libraries? Dan Siegel has already shared an early preview of Prism, a popular MVVM library.

Image prism tweet

We host a monthly community phone call to aid maintainers bring their libraries to .Cyberspace 6 and .Internet MAUI. If yous would like to participate, ship an email to david.ortinau@microsoft.com.

Get Started Today

Check out .Net MAUI today. Get started speedily be running the maui-cheque .Net tool from the command line to install .Cyberspace six Preview and all the SDK dependencies you need for developing .NET MAUI apps.

Don't have maui-bank check? Run this from your command line:

dotnet tool install -g Redth.Cyberspace.Maui.Check

Run maui-check and follow the instructions.

Open Visual Studio 2019 16.11 Preview 1 and create a new .NET Multi-platfrom App UI project.

Image new project dialog

The new solution format includes the multi-targeted projection which runs on Android, iOS, and macOS, and the two WinUI projects for Windows. In hereafter releases, the WinUI projects volition be absorbed into the multi-targeted project.

The .NET MAUI and AndroidX packages are temporarily on a hosted feed. Once nosotros take those packages bundled equally a workload this step will no longer exist needed. Run the post-obit last commands to add the required source.

dotnet new nugetconfig  dotnet nuget add source -due north maui-preview https://aka.ms/maui-preview/index.json        

To run for Android, gear up the multi-targeted project as your startup project and select the Android platform from the Run menu to run across your Android emulators.

Android emulators – if this is your first run, you may be asked to create your ain emulator before the app will deploy and run.

In coming releases we will enable iOS on Windows support for developing from Visual Studio to your connected iOS device.

For boosted information about getting started with .Net MAUI, refer to our wiki documentation on GitHub.

Feedback Welcome

Please allow u.s. know near your experiences using .Cyberspace MAUI Preview 4 to create new applications by engaging with us on GitHub at dotnet/maui.

For a look at what is coming in hereafter releases, visit our product roadmap.