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
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.
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.
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!