两种状态之间的平滑过渡（动态生成）

我有一个图形元素。我们给出一个初始状态。两种状态之间的平滑过渡（动态生成）

定义状态：屏幕上的位置以及由图像3个角的坐标（左上角，右上角和左下角）给出的自定义变换（比例尺+旋转+倾斜度）。

然后在一段时间后，该应用程序接收一些输入提供一个新的状态。此时我需要图形元素开始向新状态转换，做一个自然转换（不要在元素的比例中出现大的失真）。

Transition example

此外，如果一个新的状态，之前收到的过渡结束后，它被放弃，新的过渡，从那里开始保持。

任何建议我怎么做到这一点？

来源

2011-06-23 Iulius Curt

iuliux，

经典执行动画在N个步骤的过渡如下：

for (i = 0; i <= N; ++i) { 
    for (p = 0; p < nPoints; ++p) { 
    pointsToDraw[p] = initialPoints[p] + (finalPoints[p] - initialPoints[p]) * i/N 
    } 
    drawFigureAt(pointsToDraw); 
}

在英国：

对于每个点，假设其初始之间的线和最终职位。
沿着线将点划分成N个大小相等的点。
使用第一组点，那么接下来，等绘制图

如果数字移动您所绘制的最终状态之前，复制其当前位置到initialPoints并开始转换再次。

希望有帮助！

来源

2011-06-25 13:27:40

看起来并不那么简单。如果我这样做，在转换过程中图像会变得非常糟糕。 –

仔细检查您的代码，并确保每个初始点对应于正确的中间点和最终点。如果您发布代码，我们会更好地提供帮助。 –

我的意思是，如果中间点在从源到目标的直线上，并且每个点都是自己的独立过渡，则图像可能会沿途变形。尽管如此，我放弃了这一点，最终我以一种更简单的方式做到了这一点。无论如何，我接受了你的答案，并感谢你的时间。 –

两种状态之间的平滑过渡（动态生成）

回答

相关问题