ImplicitAnimationSet
类型等效于隐式合成动画上下文中的 AnimationSet
。 它表示一组只能在合成层上运行的隐式动画,这些动画分为三个类别:显示动画、隐藏动画和隐式动画。 ImplicitAnimationSet
将包含的动画类型限制为实现 IImplicitTimeline
接口的对象,以便在从 XAML 构造动画时提供额外一层的生成时安全性。 与用于显式动画的其他接口类似,此体系结构还可扩展,用户还可以轻松地将实现此接口的自定义类型插入到 ImplicitAnimationSet
集合中。
平台 API:
ImplicitAnimationSet
、AnimationSet
、IImplicitTimeline
、Implicit
工作原理
ImplicitAnimationSet
主要是以隐式方式用于通过 Implicit
类附加隐式动画,该类会公开附加属性以将隐式动画设置为 UI 元素。 如上所述,当显示或隐藏元素时,或每当某个目标属性发生更改时,都可以将隐式合成动画设置为触发。 这样可以轻松创建动态响应 UI 元素视觉状态变化的动画,从而可以在不同的位置或布局之间顺畅切换。
下面是一个示例,展示了如何使用 Implicit
类将不同的动画附加到 UI 元素:
<!--Implicit show animations-->
<animations:Implicit.ShowAnimations>
<animations:TranslationAnimation Duration="0:0:1" From="0,-200,0" To="0"/>
<animations:OpacityAnimation Duration="0:0:1" From="0" To="1.0"/>
</animations:Implicit.ShowAnimations>
<!--Implicit hide animations (using both default and custom animations)-->
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation Duration="0:0:1" To="0"/>
<animations:ScalarAnimation Target="Translation.Y" Duration="0:0:1" To="-200">
<animations:ScalarKeyFrame Key="0.1" Value="30"/>
<animations:ScalarKeyFrame Key="0.5" Value="0.0"/>
</animations:ScalarAnimation>
</animations:Implicit.HideAnimations>
<!--Implicit animations (using an expression keyframe as well).
These animations can also bind to other properties as triggers: in this
example we are animating the rotation whenever the Offset changes.-->
<animations:Implicit.Animations>
<animations:OffsetAnimation Duration="0:0:1"/>
<animations:RotationInDegreesAnimation ImplicitTarget="Offset" Duration="0:0:1.5">
<animations:ScalarKeyFrame Key="1.0" Expression="this.Target.Offset.X"/>
</animations:RotationInDegreesAnimation>
<animations:ScaleAnimation Duration="0:0:1"/>
</animations:Implicit.Animations>
<!-- Licensed to the .NET Foundation under one or more agreements. The .NET Foundation licenses this file to you under the MIT license. See the LICENSE file in the project root for more information. -->
<Page x:Class="AnimationsExperiment.Samples.AnimationsImplicitSample"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:animations="using:CommunityToolkit.WinUI.Animations"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:AnimationsExperiment.Samples"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:ui="CommunityToolkit.WinUI"
mc:Ignorable="d">
<Grid Height="480">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Canvas>
<Border x:Name="Element"
Canvas.Left="100"
Canvas.Top="100"
Width="100"
Height="100"
Background="{ThemeResource AccentFillColorDefaultBrush}"
CornerRadius="{StaticResource ControlCornerRadius}">
<animations:Implicit.ShowAnimations>
<animations:TranslationAnimation From="0, -200, 0"
To="0"
Duration="0:0:1" />
<animations:OpacityAnimation From="0"
To="1.0"
Duration="0:0:1" />
</animations:Implicit.ShowAnimations>
<animations:Implicit.HideAnimations>
<animations:OpacityAnimation To="0.0"
Duration="0:0:1" />
<animations:ScalarAnimation Target="Translation.Y"
To="-200"
Duration="0:0:1">
<animations:ScalarKeyFrame Key="0.1"
Value="30" />
<animations:ScalarKeyFrame Key="0.5"
Value="0.0" />
</animations:ScalarAnimation>
</animations:Implicit.HideAnimations>
<animations:Implicit.Animations>
<animations:OffsetAnimation Duration="0:0:1" />
<animations:RotationInDegreesAnimation ImplicitTarget="Offset"
From="0"
To="0"
Duration="0:0:1.2">
<animations:ScalarKeyFrame Key="0.9"
Value="80" />
</animations:RotationInDegreesAnimation>
<animations:ScaleAnimation Duration="0:0:1" />
</animations:Implicit.Animations>
</Border>
</Canvas>
<StackPanel Grid.Row="1"
HorizontalAlignment="Center"
Orientation="Horizontal"
Spacing="8">
<Button Click="Visibility_Click"
Content="Toggle visibility" />
<Button Click="Move_Click"
Content="Move" />
<Button Click="Scale_Click"
Content="Scale" />
</StackPanel>
</Grid>
</Page>
// Licensed to the .NET Foundation under one or more agreements.
// The .NET Foundation licenses this file to you under the MIT license.
// See the LICENSE file in the project root for more information.
#if WINAPPSDK
using Microsoft.UI.Xaml.Hosting;
#else
using Windows.UI.Xaml.Hosting;
#endif
using System.Numerics;
namespace AnimationsExperiment.Samples;
[ToolkitSample(id: nameof(AnimationsImplicitSample), "Implicit animations", description: $"A sample for showing how to create and use implicit animations.")]
public sealed partial class AnimationsImplicitSample : Page
{
private Random _random = new Random();
public AnimationsImplicitSample()
{
this.InitializeComponent();
}
private void Visibility_Click(object sender, RoutedEventArgs e)
{
Element.Visibility = Element.Visibility == Visibility.Visible ? Visibility.Collapsed : Visibility.Visible;
}
private void Move_Click(object sender, RoutedEventArgs e)
{
Canvas.SetTop(Element, _random.NextDouble() * this.ActualHeight);
Canvas.SetLeft(Element, _random.NextDouble() * this.ActualWidth);
}
private void Scale_Click(object sender, RoutedEventArgs e)
{
var visual = ElementCompositionPreview.GetElementVisual(Element);
visual.Scale = new Vector3(
(float)_random.NextDouble() * 2,
(float)_random.NextDouble() * 2,
1);
}
}