.NET MAUI candidate version, what little surprises can it bring you?

good news! .NET MAUI release candidate release. The SDK now has an API integrated, the library can be updated, and it is ready for general release (GA) compatibility. Like other .NET release candidates, this release includes a "go live" support policy, which means that .NET MAUI will be supported by Microsoft in your production application.

---

Get .NET MAUI RC1, install or update Visual Studio 2022 Preview 17.2 to Preview 3. In the installer, verify that .NET MAUI (Preview) is selected under Mobile Development with .NET Workloads.

To use .NET MAUI RC1 on Mac, follow the command line instructions on the wiki. In the Mac version of Visual Studio 2022, support for .NET MAUI will be officially released in a future preview release.

There are release notes for this RC version on GitHub. For more information on getting started with .NET MAUI, please refer to our documentation , as well as a table of migration tips for a set of changes to apply when upgrading your project.

Start your journey with the .NET Podcast app (pictured above), which runs on Android, iOS, macOS, and Windows, and showcases the native app UI and Blazor Hybrid .

How long is Xamarin supported? The Xamarin support policy remains in effect for 2 years after these products are first released. The last release was in November 2021, so support will continue until November 2023.

What's in the .NET MAUI release candidate?

As a multi-platform application building framework, .NET MAUI leverages platform SDKs for Android, iOS, macOS, and Windows. These basic blocks are all included in this release, and in addition to using .NET MAUI to maximize code sharing and efficiency, you can also use C# directly.

.NET MAUI provides over 40 layouts and controls optimized for building responsive UIs across platforms and mobile platforms. You can also integrate Blazor components or the entire Blazor application to publish the same experience on desktop and mobile as you publish on the web today.

How does it compare to Xamarin.Forms? You get all the UI controls that come with Xamarin.Forms, plus new ones like BlazorWebView, Border, GraphicsView, MenuBar, Shadow, and Window.

In addition to related topics, there are also these that are documented , such as:

• animation
• Brushes for solid and gradient colors
• Show popup
• Graphics, take full advantage of Microsoft.Maui graphics blend modes, colors, canvas drawing, images, transitions, winding modes, and more
• shadow
• Styling with XAML and CSS
• Themes for light and dark modes
• visual state

The new .NET MAUI project template now includes a default stylesheet in "Resourcesstyles.xaml" that provides palettes and styles for all controls. Taking Entry as an example, when launching a new application, these text inputs will now start with a shared theme while still being valid for the platform on which it runs.

 <Style TargetType="Entry">
<Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource White}}" />
<Setter Property="FontFamily" Value="OpenSansRegular"/>
<Setter Property="FontSize" Value="14" />
<Setter Property="PlaceholderColor" Value="{AppThemeBinding Light={StaticResource LightGray}, Dark={StaticResource DarkGray}}" />
<Setter Property="VisualStateManager.VisualStateGroups">
<VisualStateGroupList>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<VisualState.Setters>
<Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource Black}, Dark={StaticResource White}}" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Disabled">
<VisualState.Setters>
<Setter Property="TextColor" Value="{AppThemeBinding Light={StaticResource LightGray}, Dark={StaticResource DarkGray}}" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateGroupList>
</Setter>
</Style>

For views that support different states, we create a sensible default and provide options for light and dark mode colors. For more information, check out:

• style
• theme
• visual state

Animation: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/animation/basic?ocid=AID3042760

Brushes: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/brushes/?ocid=AID3042760

Show popups: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/pop-ups?ocid=AID3042760

Graphics: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/graphics/?ocid=AID3042760

Shadow: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/shadow?ocid=AID3042760

XAML: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/styles/xaml?ocid=AID3042760

CSS styles: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/styles/css?ocid=AID3042760

Theme: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/theming?ocid=AID3042760

Visual states:https://docs.microsoft.com/en-us/dotnet/maui/user-interface/visual-states?ocid=AID3042760

Styles: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/styles/xaml?ocid=AID3042760

Theme: https://docs.microsoft.com/en-us/dotnet/maui/user-interface/theming?ocid=AID3042760

Visual states:https://docs.microsoft.com/en-us/dotnet/maui/user-interface/visual-states?ocid=AID3042760

custom control

One of the things that .NET MAUI improves on the Xamarin.Forms architecture is the addition of low-code hooks to modify almost everything. Let's consider a typical example of removing the unique Android underscore on the Entry field. You might go for this when there is no multi-platform style "underscore" and it only exists on Android?

 #if ANDROID
Microsoft.Maui.Handlers.EntryHandler.Mapper.ModifyMapping("NoUnderline", (h, v) =>
{
    h.PlatformView.BackgroundTintList = ColorStateList.ValueOf(Colors.Transparent.ToPlatform());
});
#endif

That's all the code. This code only needs to run at the beginning of the application before calling the handler.

Let's explain how this works. First, #if ANDROID is a conditional compilation directive, indicating that this code will only run on Android. In other cases, when you are modifying controls for all platforms, this is unnecessary.

Next, we need to access the controls. The Entry you are using is a .NET MAUI control. Each property, command, event, etc. of an Entry is "mapped" to the platform through a "handler". To modify the map, you can enter it via the handler's map ( Microsoft.Maui.Handlers.EntryHandler.Mapper ). From the mapper we have 3 methods:

• PrependToMapping runs before .NET MAUI code
• modifmapping runs, not .NET MAUI code
• AppendToMapping runs after .NET MAUI code

For this case, it doesn't matter which we use, as it will be called at least once and no other implementation on Entry will touch the native property we need to modify. This code uses modifmapping and adds an Entry called "NoUnderline". Usually this property matches the name of the actual property, but in this case we'll introduce a new property.
The h in the action is the handler which allows us to access the TextView which is an Android type in the PlatformView. At this point, the code is working directly with the Android SDK.

Now that the underline is removed, you can implement your own design, say, a bezel like an old Windows Phone.

 <Border Stroke="{StaticResource Black}"
StrokeThickness="2"
StrokeShape="Rectangle">
<Entry
Margin="20,4"
Placeholder="Username" />
</Border>

For more examples of how to easily modify the look and feel of cross-platform and platform-specific layer controls, see the documentation for custom controls .

we need your feedback

Follow our simple guide to install the latest preview version of Visual Studio 2022 (17.2 Preview 3) and build your first multi-platform application.

When you have any questions, please ask at dotnet/maui on GitHub or Microsoft Q&A .

Learn more about .NET MAUI

---

Scan the code to follow Microsoft China MSDN to get more cutting-edge technology information and learning content!