Windows Presentation Foundation中的彩色动画 [英] Color Animations in Windows Presentation Foundation

问题描述

大家好，

我有以下问题:我想在按钮上创建动画，以更改按钮的笔刷(线性渐变笔刷).该按钮最初是灰色的，当鼠标悬停在上面时，我要从左侧开始，将颜色平滑地更改为蓝色，直到整个按钮变为蓝色.但是我不希望它在这里停下来，而是在此之后重复该行为，但会随机使用另一种颜色来创建类似瀑布的效果.问题是如何将Color动画的To属性绑定到颜色集合，并在每个完整的动画之后更改为该集合中的下一项.我想在XAML中以编程方式做到这一点.
这个问题有什么答案吗?

预先感谢，
Tamash

Hello everyone,

I have the following problem : I want to create a animation on a button that changes the brush (linear gradient brush) of a button. The button is initially gray and when the mouse is over it, I want to start from the left and change the color to blue smoothly until the whole button is blue. But I don''t want it to stop it here but after that to repeat the behavior but with another color randomly, to create a waterfall like effect. The problem is how to bound the To property of the Color animation to a collection of color and after each complete animation to change to the next item in the collection. And I would like to do this in XAML not programmatically.
Is there any answer to this problem?

Thanks in advance,
Tamash

推荐答案

您看过ColorAnimation吗?正是为了这个.

http://msdn.microsoft.com/en-us/library/system.windows.media.animation.coloranimation.aspx [ ^ ]

Have you looked at ColorAnimation? That''s precisely meant for this.

http://msdn.microsoft.com/en-us/library/system.windows.media.animation.coloranimation.aspx[^]

嗨！

似乎正是您所需要的

Hi!

Seems it is exactly what you need

<Button Content="Load" Width="100" Height="30" Click="Button_Click">
            <Button.Template>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid>
                        <Border Background="{TemplateBinding Background}">
                            <ContentControl Content="{TemplateBinding Content}"

                                            VerticalAlignment="Center"

                                            HorizontalAlignment="Center"/>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Button.Template>
            <Button.Triggers>
                <EventTrigger RoutedEvent="MouseLeave">
                    <BeginStoryboard>
                        <Storyboard Duration="0:0:3">
                            <ColorAnimation Storyboard.TargetName="stop1" Storyboard.TargetProperty="Color" To="LightGray"/>
                            <ColorAnimation Storyboard.TargetName="stop2" Storyboard.TargetProperty="Color" To="LightGray"/>
                            <ColorAnimation Storyboard.TargetName="stop3" Storyboard.TargetProperty="Color" To="LightGray"/>
                            <ColorAnimation Storyboard.TargetName="stop4" Storyboard.TargetProperty="Color" To="LightGray"/>
                            <ColorAnimation Storyboard.TargetName="stop5" Storyboard.TargetProperty="Color" To="LightGray"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
                <EventTrigger RoutedEvent="MouseEnter">
                    <BeginStoryboard>
                        <Storyboard Duration="0:0:3">
                            <ColorAnimation Storyboard.TargetName="stop1" Storyboard.TargetProperty="Color" To="LightBlue"/>
                            <ColorAnimation Storyboard.TargetName="stop2" Storyboard.TargetProperty="Color" To="DarkBlue"/>
                            <ColorAnimation Storyboard.TargetName="stop3" Storyboard.TargetProperty="Color" To="LightBlue"/>
                            <ColorAnimation Storyboard.TargetName="stop4" Storyboard.TargetProperty="Color" To="DarkBlue"/>
                            <ColorAnimation Storyboard.TargetName="stop5" Storyboard.TargetProperty="Color" To="LightBlue"/>
                        </Storyboard>
                    </BeginStoryboard>
                    <BeginStoryboard>
                        <Storyboard Duration="0:0:3" RepeatBehavior="Forever">
                            <DoubleAnimation  Storyboard.TargetName="stop1" Storyboard.TargetProperty="Offset" To="0"

                                              From="-1" RepeatBehavior="Forever"/>
                            <DoubleAnimation  Storyboard.TargetName="stop2" Storyboard.TargetProperty="Offset" To="0.5"

                                              From="-0.5" RepeatBehavior="Forever"/>
                            <DoubleAnimation  Storyboard.TargetName="stop3" Storyboard.TargetProperty="Offset" To="1"

                                              From="0" RepeatBehavior="Forever"/>
                            <DoubleAnimation  Storyboard.TargetName="stop4" Storyboard.TargetProperty="Offset" To="1.5"

                                              From="0.5" RepeatBehavior="Forever"/>
                            <DoubleAnimation  Storyboard.TargetName="stop5" Storyboard.TargetProperty="Offset" To="2"

                                              From="1" RepeatBehavior="Forever"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Button.Triggers>
            <Button.Background>
                <LinearGradientBrush>
                    <GradientStop Offset="-1" x:Name="stop1" Color="LightGray"/>
                    <GradientStop Offset="-0.5"  x:Name="stop2" Color="LightGray"/>
                    <GradientStop Offset="0" x:Name="stop3" Color="LightGray"/>
                    <GradientStop Offset="0.5" x:Name="stop4" Color="LightGray"/>
                    <GradientStop Offset="1"  x:Name="stop5" Color="LightGray"/>
                </LinearGradientBrush>
            </Button.Background>
        </Button>

这篇关于Windows Presentation Foundation中的彩色动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！