动画未与 WPF 可视化状态管理器一起播放

Question

我希望添加到我的 ItemsControl 中的项在添加时对高度进行动画处理。 以下示例使用触发器完成了这项工作，但我无法让它在项目的非固定高度（在本例中为 50）下工作。

<ItemsControl ItemsSource="{Binding Notifications}">
<ItemsControl.Resources>
    <DataTemplate DataType="{x:Type Notifications1:Notification}">
        <Button x:Name="ItemButton"
                ClipToBounds="True"
                Height="0">
            <Button.Template>
                <ControlTemplate>
                    <Notifications:NotificationTile />
                </ControlTemplate>
            </Button.Template>
        </Button>
        <DataTemplate.Triggers>
            <EventTrigger RoutedEvent="FrameworkElement.Loaded"
                            SourceName="ItemButton">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetProperty="Height"
                                            Storyboard.TargetName="ItemButton"
                                            Duration="0:0:0.5"
                                            To="50" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>
</ItemsControl.Resources>

然后，我尝试使用 VisualStateManager 来执行动画，以便磁贴可以增长到所需的任何高度。 在下面的示例中，项目以正确的大小添加，但不执行动画。 我假设事件触发器甚至没有被触发？

任何想法非常感谢！

<ItemsControl ItemsSource="{Binding Notifications}"
            Width="230"
            ScrollViewer.HorizontalScrollBarVisibility="Hidden"
            HorizontalContentAlignment="Stretch">
<ItemsControl.Resources>
    <DataTemplate DataType="{x:Type Notifications1:Notification}">
        <Button x:Name="ItemButton"
                ClipToBounds="True"
                Command="{Binding DataContext.ItemClicked, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"
                CommandParameter="{Binding}"
                Visibility="{Binding IsVisible, Converter={StaticResource boolToVisibilityConverter}}">
            <Button.Template>
                <ControlTemplate>
                    <Notifications:NotificationTile />
                </ControlTemplate>
            </Button.Template>
            <VisualStateManager.CustomVisualStateManager>
                <is:ExtendedVisualStateManager />
            </VisualStateManager.CustomVisualStateManager>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup is:ExtendedVisualStateManager.UseFluidLayout="True">
                    <VisualStateGroup.Transitions>
                        <VisualTransition GeneratedDuration="0:0:2" />
                    </VisualStateGroup.Transitions>
                    <VisualState x:Name="Collapsed">
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetProperty="(FrameworkElement.Height)"
                                                Storyboard.TargetName="ItemButton"
                                                Duration="0"
                                                To="0" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Expanded">
                        <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)"
                                                            Storyboard.TargetName="ItemButton">
                                <DiscreteDoubleKeyFrame KeyTime="0"
                                                        Value="NaN" />
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <i:Interaction.Triggers>
                <i:EventTrigger SourceName="ItemButton"
                                EventName="(FrameworkElement.Loaded)">
                    <is:GoToStateAction StateName="Expanded" />
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Button>
    </DataTemplate>
</ItemsControl.Resources>

Answer 1

也许这有点跑题了，对此感到抱歉。我不确定我是否完全理解了你的问题。无论如何，通常不建议使用只有"To"的动画，因为"From"最初设置为Double.NaN，而DoubleAnimation在这种情况下不起作用。