这种动画轨迹背后的数学是什么?

时间:2014-02-16 18:30:02

标签: c++ math animation tweener

这背后的数学是什么? C ++观点。

enter image description here

有关此MSDN page here的更多示例。

  

更新:被问到一个更具体的问题。 Penner's tweens^的数学/动画理论是什么?你怎么想出那些公式?他们基于什么数学原理?

我和数学,我们不是BFF!我正在研究一个多FLOAT值动画师,我正在写一个UI的东西,我想知道什么是数学来自本机C ++程序员对产生这种轨迹的观点。

用Google搜索并找到代码,但我也从编程角度寻找一些理论 ......不仅仅是代码或纯数学。我可以从我在网上找到的代码一起鞭打我需要的代码,但我想在此过程中理解它。就像这个允许人们试验easing function generator的网站一样。

我还可以使用 Windows动画管理器 (我可能会感到血腥),但这只能在一个float上运行。只需设置RGB动画,就需要自己动画每个FLOAT。它导致巨大的代码膨胀......非常糟糕。

如果有人有一些提示,我会非常感激。我主要从编程的角度来看待理论。最终目标是编写一组不同的动画算法,这些算法可以在一段时间或速度等范围内将一组FLOAT从其初始值设置为目标值。

该计划不仅要编写代码,还要了解其背后的原因。然后可能会对这些动画产生创意......除非这些动画证明是一些严格的标准数学函数。

2 个答案:

答案 0 :(得分:4)

请考虑补间函数的要求。

  1. 该函数应表示两个位置/状态之间的有效平滑运动。对于那些没有阅读本书相关部分的人来说,这意味着f应该是一个连续且可区分的函数,f(0) == 0f(1) == 1;使用它作为原始构造实际运动。
  2. “Ease”(在动画补间感觉中)意味着“衍生物为零”;这给出了运动以零速度(即静止)开始和/或结束的效果。所以“轻松”意味着f'(0) == 0,“轻松”意味着f'(1) == 0
  3. 其他一切都是基于审美考虑。

    立方曲线(例如Bezier / Hermite样条曲线)很受欢迎,部分原因在于它们可以控制曲线两端的位置和切线(速度),但也因为它们接近柔性梁采用的自然形状如果你把它的位置约束在几个点上。立方体形状使弯曲梁的内应力最小化。 (不出所料,这些木梁被船设计师和其他起草人称为“花键”,因为这是我们得到这个词的地方。)

    历史上,手绘卡通动画师总是根据经验指定他们的感情。关键动画师在他们的关键图纸一侧绘制一个图表(称为“时序图”;在你最喜欢的图像搜索引擎上查看),告诉inbetweeners中间电影应该如何定时。

    然而,

    相机运动(平移,缩放,旋转)是另一回事。布局/动画艺术家指定了动画的开始和结束(使用场地图表指定),动作发生的帧数,宽松指令以及布局/动画团队认为重要的任何其他内容(例如,如果有的话) “徘徊”)。

    需要计算实际动作;如果旋转的一帧甚至是百分之几度,观众会注意到。进行这些计算是相机部门工作的一部分。

    Brian Salt写的一本名为“基本动画支架技术”的精彩书籍可追溯到物理动画相机时代,并详细描述了他们必须做的事情,以及在多大程度上。如果你对这些东西都感兴趣,我推荐它。

答案 1 :(得分:2)

数学是数学是数学。

Riemann Sum 的优秀教程将展示这一概念。

在基础编程中,您有一个数学方程式,可以为给定的X(时间)生成Y值(高度)。例如,像每秒一次,你插入一个新的X(时间)值并获得高度。

评估此函数的次数越多,分辨率越高(这是黎曼和和微积分的图表所在的位置)。你得到的最好的是曲线的近似,看起来像阶梯。

在嵌入式系统中,没有太多资源可以非常频繁地评估这样的功能。可以使用线段来近似曲线。线段越多,近似值越高(提高精度)。因此,一种方法是将曲线分解为线段。对于给定的x,请使用线的相应线性公式。对线的评估通常比评估更高度方程所需的资源更少。

您的曲线通常是从物理方程式生成的。因此,您不仅需要改进数学,还应该改进物理学。

否则,您可以在网上搜索处理轨迹的库。

当我们越靠近硬件时,可以使用一个计时器来调用一个方法来评估给定X的轨迹函数。计时器有助于产生更准确的时间值。

在网上搜索“曲线拟合算法”,“Bresenham算法”,“图形碰撞检测算法”