Famo.us Js-将实体(粒子)设置到位置的动画

Famo.us Js - Animate Body (Particle) to Position

本文关键字:设置 位置 动画 粒子 Js- us 实体 Famo      更新时间:2023-09-26

我有一个Circle(在整个问题中我将称之为Particle),其中添加了Modifier,然后添加了将事件管道传输到Generic Sync(触摸/单击)的Surfacesync事件允许我更改Particlestartupdateend事件上的位置,以便我可以在边界框内拖动它。

我的应用程序中有一条规则,如果粒子在同步的startend事件上的位置之间的距离低于某个阈值,则粒子需要设置动画回到start位置

例如:粒子在同步start上从[0,0]开始,然后移动到[10100100]。两点之间的距离(约141.42)超过了我的阈值50…

如何施加力/速度/??将Particle动画化回[0,0]

注意:我知道Modifiers可以很容易地做到这一点,但我正努力严格使用物理引擎

编辑:我找到了一个解决方案,包括使用可转换并设置一个运行间隔,以不断更新粒子的位置,然后将可转换设置为我想要的最终位置,并在可转换的回调中清除间隔。

var retreatTrans = new Transitionable(myParticle.getPosition());
// Set a temporary interval to update the position
// as we change the transitionable (below)
var retreatInterval = setInterval(function () {
  myParticle.setPosition(retreatTrans.get());
});
// Set transitionable to our desired retreatPosition
retreatTrans.set([0,0], {duration: 100}, function () {
  // Clear our interval
  clearInterval(retreatInterval);
});

如果我正确理解你的问题,你想从原点拖动particle/circle/rectangle,然后在触摸端让particle/circle/rectangle移回原点。

使用物理引擎实现这一点的方法之一是通过Spring。如果你看一下Scrollview,它在内部使用弹簧在你到达边缘时"反弹"回来。我稍后会看看是否可以快速实现来演示这一点。