将故事板放在样式或数据模板中

时间:2012-05-31 17:32:59

标签: c# wpf animation styles storyboard

我有一个动画故事板可以动画图像的宽度。我用表达式混合创建了动画:

<Storyboard x:Key="Storyboard1">
    <DoubleAnimationUsingKeyFrames 
             Storyboard.TargetProperty="(FrameworkElement.Width)" 
             Storyboard.TargetName="imageFoo">
            <EasingDoubleKeyFrame KeyTime="0:0:0.9" Value="335">
                <EasingDoubleKeyFrame.EasingFunction>
                    <BackEase EasingMode="EaseOut"/>
                </EasingDoubleKeyFrame.EasingFunction>
            </EasingDoubleKeyFrame>
    </DoubleAnimationUsingKeyFrames>
</Storyboard>

问题在于我想将该故事板分配给我的应用程序中的所有图像,而不仅仅是图像 imageFoo 。我想在MouseEnters图像时启动该动画。我怎么能这样做?

1 个答案:

答案 0 :(得分:2)

您需要从故事板中删除目标名称,并将触发器移动到一个样式中,谢天谢地,没有任何代码需要执行此操作

在App.xaml文件中(或在任何资源集合中)。

 <Application.Resources>
        <Style TargetType="{x:Type Image}">
            <Style.Triggers>
                <EventTrigger RoutedEvent="MouseEnter">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)">
                                <EasingDoubleKeyFrame KeyTime="0:0:0.9" Value="335">
                                    <EasingDoubleKeyFrame.EasingFunction>
                                        <BackEase EasingMode="EaseOut"/>
                                    </EasingDoubleKeyFrame.EasingFunction>
                                </EasingDoubleKeyFrame>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </Application.Resources>

通过声明没有x:Key的样式并简单地给出一个TargetType,你基本上告诉WPF它应该应用于具有该类型的可视化树中的每个元素。