Animate your .NET MAUI Windows app

If you're new to Windows development with .NET MAUI, you may not be familiar with some of the native tricks available. However, developers experienced in UWP and WinUI have knowledge of these tricks! Currently, .NET MAUI uses WinUI for Windows development, and there are a lot of impressive animations in WinUI that we can incorporate into our .NET MAUI apps. Let's explore some of them.

Animate moving elements

One of the animations available is the RepositionThemeTransition, which works when an element moves, such as when you resize your window or when certain events occur in your C# code. You can also utilize Triggers and VisualStates in XAML to trigger this animation. I'm absolutely enamored by this animation, It's truly remarkable. You just need to have a responsive design to witness its magic.
To animate any layout by targeting a Panel, you can use the following XAML code snippet:

    <maui:MauiWinUIApplication.Resources>
        <Style TargetType="Panel">
            <Setter Property="ChildrenTransitions">
                <Setter.Value>
                    <TransitionCollection>
                        <RepositionThemeTransition />
                    </TransitionCollection>
                </Setter.Value>
            </Setter>
        </Style>
    </maui:MauiWinUIApplication.Resources>

You can also animate individual elements like Button by specifying the target type accordingly.

Changing Page Navigation Animation

If you wish to modify the default page animation in .NET MAUI for Windows, which is the SlideNavigationTransition, here's the code you need:

    <maui:MauiWinUIApplication.Resources>
        <Style TargetType="Page">
            <Setter Property="Transitions">
                <Setter.Value>
                    <TransitionCollection>
                        <EdgeUIThemeTransition Edge="Bottom" />
                    </TransitionCollection>
                </Setter.Value>
            </Setter>
        </Style>
    </maui:MauiWinUIApplication.Resources>

That's all there is to it! Just remember to include these code snippets in the Platforms/Windows/App.xaml file of your project. Additionally, I've created a sample repository where you can access the code here.
Also you can learn more about Windows animations from here.

I hope you find these animations useful and enjoy enhancing your .NET MAUI Windows app with delightful visual effects!