WPF弹性模拟动画
原文:WPF弹性模拟动画
我们此次将要制作模拟物理中的弹性现象的交互动画,我们让一个小球向鼠标点击位置移动,这个移动的轨迹不是简单的位移,而是根据胡克定律计算得出的。
胡克定律:F=-kd
F代表弹性力的大小
d是拉伸的位移
k为弹性系数
在我们的动画中还将加入摩擦力,否则物体就如在真空中运动,永远不会停止。
需声明的是,以上知识并不属于我,也不是来自课本,要知道我的初中物理及格次数并不多,这些是来自于奇才Robert Penner的著作,而以下示例也是其书中Flash示例的翻版。
下面开始我们的示例:
首先我在Expression Design中设计了一个球的外观以及一个渐变的背景:
然后将它们导出为WPF资源字典,在Visual Studio中新建一个项目,引用上述资源做Ellipse元素和Window元素的背景,创建如下的界面:
需注意的是,要将两个Slider的Maximum属性设为1、LargeChange属性设为0.1,因为我们的两个属性取值范围都是在0-1之间。
在后台代码中将窗体的DataContext属性设为其自身,即“this”。
然后实现INotifyPropertyChanged接口,并设置4个用于前台绑定的4个属性:X、Y、弹性系数、流体摩擦力
之后将Ellipse的Canvas.Top及Canvas.Left属性分别绑定到Y和X,两个Slider的Value属性分别绑定到弹性系数和流体摩擦力。
之后为Window增加ContentRendered事件处理,在此将初始化一个计时器,以此来控制动画的每个帧:
DispatcherTimer 帧计时器;
private void Window_ContentRendered(object sender, EventArgs e)
{
帧计时器 = new DispatcherTimer();
帧计时器.Tick += new EventHandler(帧计时器_Tick);
帧计时器.Interval );
帧计时器.Start();
}
double x ;
double y ;
void 帧计时器_Tick(object sender, EventArgs e)
{
var X轴弹力 = (X - 目标位置.X) * -弹性系数;
x += X轴弹力;
x -流体摩擦力;
X += x;
var Y轴弹力 = (Y - 目标位置.Y) * -弹性系数;
y += Y轴弹力;
y - 流体摩擦力;
Y += y;
}
计时器每次触发时,都将进行位置计算,并调整X、Y的值。
其中的目标位置是在鼠标单击时指定的,为此还要为Window增加PreviewMouseLeftButtonDown事件处理:
private void Window_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
var p = e.GetPosition(this);
目标位置 = , p);
}
在此事件处理中,将目标位置设为鼠标当前坐标减去Ellipse元素的实际尺寸的一半,这样在移动完成后,球的中心点就位于鼠标的点击处了。
PS:将PreviewMouseLeftButtonDown事件改为MouseLeftButtonDown也是可行的,但是窗体内的控件如果截获并处理了点击事件,那么将不会引发球体移动。
现在编译和运行后,显示的程序界面效果如下:
通过点击可以使球移动,调整两个参数可以看到不同的移动效果。
你可以通过下面这个视频大略了解此示例的效果,但它与实际的流畅度有些差距,程序中的帧频应当是每秒100帧的,而视频只有每秒25帧。
源视频下载(清晰度高一些):http://www.box.net/shared/fjv5kucgns
本文章的PDF文档下载:http://www.box.net/shared/rlqoqf5lkp
WPF弹性模拟动画的更多相关文章
- WPF利用动画实现圆形进度条
原文:WPF利用动画实现圆形进度条 这是我的第一篇随笔,最近因为工作需要,开始学习WPF相关技术,自己想实现以下圆形进度条的效果,逛了园子发现基本都是很久以前的文章,实现方式一般都是GDI实现的,想到 ...
- WPF控制动画开始、停止、暂停和恢复
1.闲言 好久也没更新一博客了,自己有点发懒,同时确实这几个月来也有点忙.风机监测软件,项目中,有这样一个小需求:正常风机在旋转的时候,上位机软要做一个风机的图片,让它不停地旋转,一但检测到下面风机停 ...
- Wpf(Storyboard)动画简单实例
原文:Wpf(Storyboard)动画简单实例 动画的三种变换方式 RotateTransform:旋转变换变化值:CenterX围绕转的圆心横坐标 CenterY纵坐标 Angle旋转角度(角度正 ...
- WPF实现动画的几种方式及其小案例
WPF实现动画的方式: 基于计时器的动画 建立一个定时器,然后根据其频率循环调用函数或者一个事件处理函数,在这个函数中可以手工更新目标属性,直到达到最终值,这时可以停止计时器. 案例: 效果图: XA ...
- WPF之动画
原文:WPF之动画 线性关键帧.不连续关键帧动画: <Window.Triggers> <EventTrigger RoutedEvent="Window.Loaded&q ...
- WPF后台动画DoubleAnimation讲解
WPF后台动画,使用DoubleAnimation做的. 1.移动动画 需要参数(目标点离最上边的位置,目标点离最左边的位置,元素名称) Image mImage = new Image(); Flo ...
- C# WPF 时钟动画(2/2)
模拟实现时钟效果,学习WPF动画好例子,本文承接上文 C# WPF 时钟动画(1/2). 微信公众号:Dotnet9,网站:Dotnet9,问题或建议:请网站留言, 如果对您有所帮助:欢迎赞赏. C# ...
- C# WPF 时钟动画(1/2)
微信公众号:Dotnet9,网站:Dotnet9,问题或建议:请网站留言, 如果对您有所帮助:欢迎赞赏. C# WPF 时钟动画(1/2) 内容目录 实现效果 业务场景 编码实现 本文参考 源码下载 ...
- WPF路径动画(动态逆向动画)
WPF 中的Path.Data 不再多介绍,M开始坐标点 C弧度坐标点 L 直线坐标点 <Path x:Name="path0" Data="M 10,100 C ...
随机推荐
- ubuntu环境ceph配置入门(一)
环境:ubuntu server 14.04 64bit,安装ceph版本号0.79 正常情况下应有多个主机,这里为了高速入门以一台主机为例,多台主机配置方式类似. 1. 配置静态IP及主机名 静态I ...
- 屏幕对象的F1/F4输入帮助功能
1.HELP-REQUST[FOR{LOW|HIGH}]字段的F1帮助 当选择SAP屏幕功能的制定字段按F1键时可以调关注用自定义的程序或者系统帮助文件,该功能通常称为F1帮助. TYPES:syst ...
- MFC消息响应机制分析
---- 摘要: ---- MFC是Windows下程序设计的最流行的一个类库,但是该类库比较庞杂,尤其是它的消息映射机制,更是涉及到很多低层的东西,我们在这里,对它的整个消息映射机制进行了系统的分析 ...
- Tair是一个高性能,分布式,可扩展,高可靠的key/value结构存储系统(转)
Tair是一个高性能,分布式,可扩展,高可靠的key/value结构存储系统! Tair专为小文件优化,并提供简单易用的接口(类似Map)Tair支持Java和C版本的客户端 Tair is a di ...
- 591 - Box of Bricks
Box of Bricks Little Bob likes playing with his box of bricks. He puts the bricks one upon another ...
- finalize过程
之前说过case有两个 switch (startOpt) { case FORMAT: boolean aborted = format(conf, true); System.exit(abort ...
- C++著名类库和C++标准库介绍
C++著名类库 1.C++各大有名库的介绍——C++标准库 2.C++各大有名库的介绍——准标准库Boost 3.C++各大有名库的介绍——GUI 4.C++各大有名库的介绍——网络通信 5.C++各 ...
- 二进制搜索方法C++通用执行
算法很easy.直接附着到代码它 #include <iostream> using namespace std; template<typename T> int binar ...
- [C++]指针浅析
Date: 2014-1-4 summary: 指针的简单理解,概念性的东西会比较多(100个人有100种理解,此处只代表我个人看法) Contents: 1.什么是指针 c++ primer plu ...
- 有关于web server架构的一个小疑问
今天闲的时候trace route了yahoo和sina的域名,yahoo的如下: 1 1 ms 1 ms <1 ms 172.21.127.1 2 3 ms ...