BT

Facilitating the spread of knowledge and innovation in professional software development

Contribute

Topics

Choose your language

InfoQ Homepage News .NET MAUI Preview 5: Animations, Ported UI Components and Single Project Templates Updates

.NET MAUI Preview 5: Animations, Ported UI Components and Single Project Templates Updates

This item in japanese

Bookmarks

One month after Microsoft Build and Preview 4, the .NET MAUI team continued the progress with .NET Multi-platform App UI, and Preview 5 is in front of us. It brings animations and the view transformation support, a couple of ported UI Components from the renderer architecture of Xamarin.Forms, and Single Project Templates updates and improvements. 

Also, as part of this release, the preview version of documentation for introductory and foundational aspects of .NET MAUI is also available for exploration.

In this release several controls now have all properties and events ported to handlers from the renderer architecture of Xamarin.Forms, including ActivityIndicator, CheckBox, Image, and Stepper. In previous previews you would need to check if a control was ported and register renderers from the compatibility package for those unavailable. In .NET MAUI Preview 5 we have made this much easier by updating the UseMauiApp extension (see the Startup wiki) to wire up all the controls for you, whether they are based on handlers or renderers, stated David Ortinau, principal program manager, .NET Multi-platform App UI.

Well-known, the Shell, an application container that provides URI navigation and a quick way to implement flyout menus and tabs is now available in .NET MAUI with Preview 5 version. The official dev blog article provides a simple example of usage within the App.xaml.cs.

protected override IWindow CreateWindow(IActivationState activationState)
{
    return new Microsoft.Maui.Controls.Window(
        new AppShell()
    );
}
<Shell xmlns="http://schemas.microsoft.com/dotnet/2021/maui" 
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
       xmlns:pages="clr-namespace:ControlGallery.Pages"
       Title="ControlGallery"
       x:Class="ControlGallery.AppShell">

    <FlyoutItem Title="Margin and Padding">
        <ShellContent Route="marginpadding" 
                      ContentTemplate="{DataTemplate pages:ControlsPage}" />
    </FlyoutItem>

    <FlyoutItem Title="ActivityIndicator">
        <ShellContent Route="activityindicator" 
                      ContentTemplate="{DataTemplate pages:ActivityIndicatorPage}" />
    </FlyoutItem>

    ...

</Shell>

An overview of the latest information about controls, layouts, and other features can be found on the .NET MAUI status page.

There are a couple of ways to perform animation in .NET MAUI; the easy way is with extension methods such as FadeTo, RotateTo, ScaleTo, TranslateTo, and more. In the official dev blog, David Ortinau provided a sample of using them with HandlerAttached event. The sample source code can be found on the WeatherTwentyOne project on GitHub.

Regarding the Single Project Templates updates, Preview 5 also introduced some of the progress which was made consolidating the multiple WinUI projects into one. Now, the usage of dotnet new maui the command will produce the solution with two projects, one multi-targeted .NET MAUI and the WinUI project.

As stated:

This is one step closer to the final vision of having just one project that can build and deploy to all supported platforms. In order to support this, you’ll need to install these Project Reunion 0.8 (Preview) extensions for Visual Studio 16.11 Preview 2.

To follow the project development progress and next releases of .NET MAUI, the official roadmap is available on the GitHub wiki roadmap.

Rate this Article

Adoption
Style

Hello stranger!

You need to Register an InfoQ account or or login to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Community comments

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

BT