学步园

下午闲来无事看到 深蓝色右手 的

C#开发WPF/Silverlight动画及游戏系列教程(Game Tutorial)：(一)让物体动起来①

其中详细讲解了，鼠标跟随动画的制作，其中的DoubleAnimation是通过代码写的。

我这两天正在玩儿Xaml，顺手就做了个实验，动画自不必说，要说的是绑定，在Xaml

中是这样的。

 1    <Window.Resources>
 2         <Storyboard x:Key="MyStory">
 3             <DoubleAnimationUsingKeyFrames 
 4             Storyboard.TargetProperty="(UIElement.
 5                 RenderTransform).
 6                 (TransformGroup.Children)[3].
 7                 (TranslateTransform.X)" 
 8             Storyboard.TargetName="rect">                
 9             <EasingDoubleKeyFrame 
10                 KeyTime="0:0:0.3" 
11                 Value="{Binding ElementName=mainWindow ,
12                         Path= MouseLeft, Mode=OneWay}"/>
13             </DoubleAnimationUsingKeyFrames>
14             <DoubleAnimationUsingKeyFrames Storyboard.
15             TargetProperty="(UIElement.
16                 RenderTransform).
17                 (TransformGroup.Children)[3].
18                 (TranslateTransform.Y)" 
19              Storyboard.TargetName="rect">
20                 <EasingDoubleKeyFrame KeyTime="0:0:0.3" 
21                 Value="{Binding ElementName=mainWindow, 
22                 Path=MouseTop, Mode=OneWay}"/>
23             </DoubleAnimationUsingKeyFrames>
24         </Storyboard>
25     </Window.Resources>

其他东西自不必说，看11，12行和21，22行中，给动画关键桢绑定了，

一个DependencyProperty属性值。

运行正常，动画效果出来了。所以说WPF绑定无处不在啊。

贴一下源码，就不上传完整的项目了。（据说源码害人啊）喜欢的朋友可以照着做一下。

Xaml：

 1 <Window x:Class="MainWindow" x:Name="mainWindow"
 2     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4     Title="MainWindow" Height="350" Width="525">
 5     <Window.Resources>
 6         <Storyboard x:Key="MyStory">
 7             <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" 
 8                                            Storyboard.TargetName="rect">                
 9                 <EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="{Binding ElementName=mainWindow ,Path= MouseLeft, Mode=OneWay}"/>
10             </DoubleAnimationUsingKeyFrames>
11             <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" 
12                                            Storyboard.TargetName="rect">
13                 <EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="{Binding ElementName=mainWindow, Path=MouseTop, Mode=OneWay}"/>
14             </DoubleAnimationUsingKeyFrames>
15         </Storyboard>
16     </Window.Resources>
17     <Window.Triggers>
18         <EventTrigger RoutedEvent="FrameworkElement.Loaded">
19             <BeginStoryboard Storyboard="{StaticResource MyStory}"/>
20         </EventTrigger>
21     </Window.Triggers>
22     <Canvas Name="myCanvas" MouseLeftButtonDown="myCanvas_MouseLeftButtonDown" Background="Transparent">
23         <Rectangle Name="rect" Fill="Red" RadiusX="12" RadiusY="12" Width="50" Height="50" Canvas.Left="0" Canvas.Top="0" RenderTransformOrigin="0.5,0.5">
24             <Rectangle.RenderTransform>
25                 <TransformGroup>
26                     <ScaleTransform/>
27                     <SkewTransform/>
28                     <RotateTransform/>
29                     <TranslateTransform/>
30                 </TransformGroup>
31             </Rectangle.RenderTransform></Rectangle>
32     </Canvas>
33 </Window>
34 

后台代码：

 1 Imports System.Windows.Media.Animation
 2 
 3 Class MainWindow
 4 
 5     Public Sub New()
 6 
 7         ' 此调用是设计器所必需的。
 8         InitializeComponent()
 9 
10         ' 在 InitializeComponent() 调用之后添加任何初始化。
11 
12     End Sub
13 
14 #Region "   MouseTop  DependencyProperty "
15     ''' <summary>
16     ''' PropertyComment
17     ''' </summary>
18     ''' <remarks></remarks>
19     Public Shared ReadOnly MouseTopProperty As DependencyProperty = _
20         DependencyProperty.Register(
21             "MouseTop", GetType(Double), GetType(MainWindow), New PropertyMetadata( _
22                 0.0, New PropertyChangedCallback(AddressOf MouseTopPropertyChanged_CallBack)))
23 
24     Public Property MouseTop() As Double
25         Get
26             Return GetValue(MouseTopProperty)
27         End Get
28         Set(ByVal Value As Double)
29             SetValue(MouseTopProperty, Value)
30         End Set
31     End Property
32 
33     Public Shared Sub MouseTopPropertyChanged_CallBack(ByVal dp As DependencyObject, ByVal e As DependencyPropertyChangedEventArgs)
34 
35     End Sub
36 #End Region
37 
38 #Region "   MouseLeft  DependencyProperty "
39     ''' <summary>
40     ''' PropertyComment
41     ''' </summary>
42     ''' <remarks></remarks>
43     Public Shared ReadOnly MouseLeftProperty As DependencyProperty = _
44         DependencyProperty.Register(
45             "MouseLeft", GetType(Double), GetType(MainWindow), New PropertyMetadata( _
46                 0.0, New PropertyChangedCallback(AddressOf MouseLeftPropertyChanged_CallBack)))
47 
48     Public Property MouseLeft() As Double
49         Get
50             Return GetValue(MouseLeftProperty)
51         End Get
52         Set(ByVal Value As Double)
53             SetValue(MouseLeftProperty, Value)
54         End Set
55     End Property
56 
57     Public Shared Sub MouseLeftPropertyChanged_CallBack(ByVal dp As DependencyObject, ByVal e As DependencyPropertyChangedEventArgs)
58 
59     End Sub
60 #End Region
61 
62     Private Sub myCanvas_MouseLeftButtonDown(ByVal sender As System.Object, ByVal e As System.Windows.Input.MouseButtonEventArgs)
63 
64         Dim p As Point = e.GetPosition(myCanvas)
65         MouseLeft = p.X
66         MouseTop = p.Y
67         BeginStoryboard(Me.Resources.Item("MyStory"))
68 
69     End Sub
70 End Class
71 

齐活。