有没有办法将对象设置为动画？ [英] is there way to style object into animation?

问题描述

假设我有底，我想给他打造风格并将动画放入风格中

我能做到吗？

i尝试很多次但是做不到，

suppose i have bottom and i want to style him and put animation in the style
can i do that ?
i try many time but fail do it ,
i will be glad if some one show me example of how its done

推荐答案

我会假设底部你的意思是Button，那么
i会很高兴。



将动画添加到样式中并不比将样式添加到控件的任何其他属性要困难得多。当然，你需要声明动画如何以及何时启动但是有很多好的资源可以解释这个;

按钮样式 [ ^ ]

WPF中的动画 [ ^ ]



下面是一个简短的例子，展示如何为两者设置动画鼠标悬停的背景颜色和宽度：

I'm going to assume by "bottom" you mean Button.

Adding animation to a style is not much harder that adding a change to any other property of the control you're styling. Granted, you need to declare how and when the animation kicks in but there are a lot of good resources for that explain this;
Button styles[^]
Animation in WPF[^]

Below is a brief example that shows how to animate both background color and width on mouse over:

<Window x:Class="ButtonThingy.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="Button Style Window" Height="350" Width="525">
    <Window.Resources>
        <Style TargetType="{x:Type Button}">
            <!-- Define the template -->
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <!-- x:Name here is required because the Storyboard needs to know its target -->
                        <Border TextBlock.Foreground="{TemplateBinding Foreground}" x:Name="Border" CornerRadius="2" BorderThickness="1" Width="200" Height="100">
                            <Border.Background>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                    <LinearGradientBrush.GradientStops>
                                        <GradientStopCollection>
                                            <GradientStop Color="Silver" Offset="0.0" />
                                            <GradientStop Color="Green" Offset="1.0" />
                                        </GradientStopCollection>
                                    </LinearGradientBrush.GradientStops>
                                </LinearGradientBrush>
                            </Border.Background>
                            <Border.BorderBrush>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                    <LinearGradientBrush.GradientStops>
                                        <GradientStopCollection>
                                            <GradientStop Color="Silver" Offset="0.0" />
                                            <GradientStop Color="Green" Offset="1.0" />
                                        </GradientStopCollection>
                                    </LinearGradientBrush.GradientStops>
                                </LinearGradientBrush>
                            </Border.BorderBrush>
                            <!-- Define state transitions, these are animation that affect properties set above -->
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="0:0:0.5" />
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <!-- First animation just changes the background colour -->
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0" Value="Blue" />
                                            </ColorAnimationUsingKeyFrames>
                                            
                                            <!-- This animation changes the width of the button -->
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Width" Storyboard.TargetName="Border">
                                                <EasingDoubleKeyFrame KeyTime="0" Value="300"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <!-- This defines where the content, if this case "I am a button", goes inside the template -->
                            <ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True" />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <!-- Button picks up the style above automatically because no style is explicitly set -->
        <Button Content="I am a button"/>
    </Grid>
</Window>

希望这会有所帮助，

Fredrol

Hope this helps,
Fredrol

这篇关于有没有办法将对象设置为动画？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！