.NET Multi-platform App UI (MAUI) Preview 9 is available today with .NET 6 RC2 and in the preview channel of Visual Studio 2022 Preview 5. While much of the work in this preview is focused on completing and stabilizing the 50+ controls and layouts, preview 9 adds support for borders, corners, and shadows across most all controls and layouts. Preview 9 includes performance improvements to help Android apps start instantly.
Roadmap news: as Scott Hunter shared last month, .NET MAUI will continue releasing previews monthly as we make our way to a release candidate (RC) in the first quarter of 2022, and general availability (GA) in the second quarter of 2022.
Updated Controls
New in this release are updated implementations of several controls. BoxView is a simple yet flexible and adaptive view that is useful for many needs. IndicatorView pairs with any collection based control to display an index of pagination using any shape you need. ImageButton is perfect for what you need a button that is just an image. WebView uses the platform native browser control to render any online or embedded HTML content; ideal for displaying markup more complex than the subset of HTML supported by Label.
More information:
Borders, Corners, and Shadows – Oh my!
The new Microsoft.Maui.Graphics library provides a consistent UI drawing API based on native graphics engines, and enables us to easily add borders, corner rendering, and beautiful shadows to most any layout or control in .NET MAUI.
The new Border control can wrap any layout or control to add borders and independent control of each corner. This controls is provided in the style of WPF, UWP, Silverlight, and the latest Windows App SDK. In this example I have wrapped a border control around the counter label in our default template to add the stroke and round the top-left and bottom-right corners.
<Border
Grid.Row="2"
Padding="16,8"
Stroke="{StaticResource PrimaryBrush}"
Background="#2B0B98"
StrokeThickness="4"
HorizontalOptions="Center">
<Border.StrokeShape>
<RoundRectangle CornerRadius="40,0,0,40"/>
</Border.StrokeShape>
<Label
Text=".NET MAUI Preview: 9"
FontSize="18"
FontAttributes="Bold"
TextColor="White"
x:Name="CounterLabel" />
</Border>The corner radius of the provided shape accepts a Thickness type value which enables independent control of each corner of the rectangle: top-left, top-right, bottom-left, bottom-right.
The border control does add a wrapping view element around a single content, so you can set a background color or padding as needed. Several other properties are available to customize the stroke of the border such as:
- StrokeDashArray: pattern of dashes and gaps in the stroke
- StrokeDashOffset: distance within the dash pattern
- StrokeLineCap: shape at the end of a line
- StrokeLineJoin: type of join at the vertices
- StrokeMiterLimit: limit on the ration of the miter length to half of the stroke thickness
In a future version we’ll investigate adding a markup helper for setting the stroke shape directly rather than instantiating a shape.
Ready to add some depth to your UI? Add a Shadow to any layout or control, including images and shapes.
<Image>
<Image.Shadow>
<Shadow Brush="#000000"
Offset="20,20"
Radius="40"
Opacity="0.8"/>
</Image.Shadow>
</Image>Quick Android Startup
Ahead-of-time (AOT) compilation makes a big difference in how quickly your applications can code start on Android. Full AOT may also make your application artifacts larger than you wish if you’re working to remain below the wifi installation bar. In this situation, Startup Tracing is the answer. By partially AOT’ing only the parts of your application executed during startup (by tracing the path of startup execution, hence the name), we are able to balance speed and size.
Preview 9 now ships with a .NET MAUI startup tracing profile, and can be used when building from command line.
Benchmark numbers from Pixel 5 device tests:
| [Android App][1] | [.NET MAUI App][2] | |
|---|---|---|
| JIT startup time (s) | 00:00.4387 | 00:01.4205 |
| AOT startup time (vs. JIT) | 00:00.3317 ( 76%) | 00:00.7285 ( 51%) |
| Profiled AOT startup time (vs. JIT) | 00:00.3093 ( 71%) | 00:00.7098 ( 50%) |
JIT .apk size (B) |
9,155,954 | 17,435,225 |
AOT .apk size (vs. JIT) |
12,755,672 (139%) | 44,751,651 (257%) |
Profiled AOT .apk size (vs. JIT) |
9,777,880 (107%) | 23,210,787 (133%) |
We have a pull request for making this the default profile for .NET MAUI applications built in release configuration.
Jonathan Peppers also found an additional 400ms improvement by optimizing the Android resource designer file.
Ecosystem Controls
DevExpress, Syncfusion, and Telerik have recently all shipped new sets of controls for .NET MAUI, and are making use of the powerful graphics support provided in Microsoft.Maui.Graphics.
Get Started Today
First thing’s first, install Visual Studio 2022 Preview 5 and check .NET MAUI (preview) under the Mobile Development with .NET workload, and check the Universal Windows Platform development workload.
Now, install the Windows App SDK Single-project MSIX extension. Before running the Windows target, remember to uncomment the framework in the csproj file.
Ready? Open Visual Studio 2022 and create a new project. Search for and select .NET MAUI.
For additional information about getting started with .NET MAUI, refer to our documentation.
If you are migrating a project from another preview, check out our migration notes in the dotnet/maui wiki.
Feedback Welcome
Visual Studio 2022 previews are rapidly enabling new features for .NET MAUI. As you encounter any issues with debugging, deploying, and editor related experiences, please use the Help > Send Feedback menu to report your experiences.
Please let us know about your experiences using .NET MAUI to create new applications by engaging with us on GitHub at dotnet/maui.
For a look at what is coming in future releases, visit our product roadmap, and for a status of feature completeness visit our status wiki.
Any news about the porting mediaelement control? whene it will be available under windows platform?
My applications are not using Xamarin.Forms, but Xamarin Native (Xamarin.iOS and Xamarin.Android) and .Net Standard Library as shared project. How do I migrate my application in this case? Do we have any example?
Do you have any documentation or examples of how to create a project with Shell? Obviously it can be done, but I have not been able to find any descriptions.
When will the project template include an option to use shell?
Where are you WRT best practices for porting Xamarin production code? Obviously production code needs to evolve while the porting effort is underway. Can any UI code be shared between Xamarin and Maui projects, or will we have to copy all code?
Which XCode version is .Net for iOS compatible with?
This release needs Xcode 13 Beta 5 due to Apple removing macOS from their stable release. It’s now back in 13.1 as of today, which we’ll ship in the next preview likely.
When might we expect a new Maui preview? The roadmap says November, but we have had 2 VS2022 preview releases since Maui preview 9, and no comms from MS regarding Maui either way.
Is Maui preview 10 in the new VS2022 Preview 6? I haven’t seen any release notes and haven’t seen any new fixes so far.
David, any chance of a preview 5.1/9.1 with the ignored info.plist issue fixed? There isn't much I can do with preview 5/9 without that.
Or can you point me at where the default values are being picked up from? In a default new app it is finding a deploy target 12.4 from somewhere, but its not in the info.plist under platforms/iOS and the project SupportedOSPlatformVersion version is 14.2, which means the build fails. Updating info.plist...
I installed an early release of .Net Maui and have not had anything “maui” work properly since the early version of Maui Check. I uninstalled all versions of visual studio and I am ready to give up on Microsoft tools. Where can I get a tool to clean up Maui besides reinstalling the OS?
This may be the script you need, after you uninstall all .NET previews from Add/Remove Programs on Windows, and uninstalling other VS22 previews.
https://github.com/Redth/dotnet-maui-check/blob/main/Clean-Old-DotNet6-Previews.ps1
Then reinstall VS22 Preview 5 with .NET MAUI selected.
Will it be possible to develop ON a linux machine for the supported systems (not really talking about developing for linux, which is what i hope comes from the community in some time).
For example with VSCode or a Jetbrains Product?
If so, is there an ETA for that?
Still having issue when trying to debug Genymotion Emulator detected as Android Local Device. I get the “Application in Break mode” as described here: https://github.com/dotnet/maui/issues/2699
That’s a blocking issue on my side… (Amd Processor without Hyper-V). Any workaround ?
If it can help others… I’ve started a project by using the following template: https://marketplace.visualstudio.com/items?itemName=egvijayanand.maui-templates (up-to-date for Preview 8)
Details about how to set up logging in Maui apps would be highly appreciated (before the stable release) 👍 Cannot seem to find anything in the documentation.