Famo.us 球拖放,释放时设置速度



我正在尝试通过 Famo.us 实现类似于空气曲棍球桌效果的东西。这个想法是有多个可以碰撞的圆体(见战斗)。

现在我首先关心的是让球的矢量属性在拖曳开始时归零。

我正在尝试使用Particle.reset中的"reset()"方法,但遇到了大量问题。以下是我到目前为止拥有的代码笔中的一些代码:

  ball.draggable.on("start", function(pos) {
    var zeroV = new Vector(0, 0, 0);
    // need to remove force here
    ball.circle.reset(pos.position, zeroV, ball.circle.orientation, zeroV);
});

知道一旦我开始拖拽,如何最好地将球上的力归零吗?另外,我如何确定相对于用户在发布前拖动的速度的发布速度?

这两个问题的答案都在于 Famo.us 从物理引擎中添加和删除body粒子。

下面是示例代码:jsBin 代码

注意:此示例不能解决您的整个解决方案,但确实回答了您的问题,并应帮助您达到所需的效果。

知道一旦我开始拖拽,如何最好地将球上的力归零吗?

您不会将力归零,而是暂时将粒子从引擎中分离出来。

physicsEngine.removeBody(this.particle);

在示例中,我在单击创建的圆表面时执行此操作。

ball.particle = new Circle({
  radius: radius,
  position: [x, y, 0]
});
ball.physicsID = physicsEngine.addBody(ball.particle);
physicsEngine.attach(collision, balls, ball.particle);
ball.on('click', function(){
  if (!this.stopped) {
    physicsEngine.removeBody(this.particle);
  } else {
    this.physicsID = physicsEngine.addBody(this.particle);
    physicsEngine.attach(collision, balls, this.particle);
    balls.push(this.particle);
  }
  console.log('balls', balls);
  this.stopped = !this.stopped;
});

如何确定发布速度相对于用户在发布前拖动的速度?

当您拖动正方形表面并on('end'...将速度传递给粒子的创建。您可以使用拖动端的速度通过setVelocity启动粒子的运动。

ball.particle.setVelocity(velocity);

如示例代码所示:

sync.on('end', function(data){
  if (!surface.createdBall && data.velocity){
    var velocity = data.velocity;
    surface.createdBall = true;
    var endX = position[0] + 0;
    var endY = position[1] + 0;
    createBall(endX, endY, velocity);
  }
});

  function createBall(x, y, velocity) {
    var ball = new Surface({
      size: [radius * 2, radius * 2],
      properties: {
        backgroundColor: 'blue',
        borderRadius: (radius * 2) + 'px'
      }
    });
    ball.particle = new Circle({
      radius: radius,
      position: [x, y, 0]
    });
    ball.physicsID = physicsEngine.addBody(ball.particle);
    physicsEngine.attach(collision, balls, ball.particle);
    node.add(ball.particle).add(ball);
    balls.push(ball.particle);
    console.log('created ball', velocity);
    ball.particle.setVelocity(velocity);
    surface.createdBall = false;
    ball.on('click', function(){
      if (!this.stopped) {
        physicsEngine.removeBody(this.particle);
      } else {
        this.physicsID = physicsEngine.addBody(this.particle);
        physicsEngine.attach(collision, balls, this.particle);
        balls.push(this.particle);
      }
      console.log('balls', balls);
      this.stopped = !this.stopped;
    });
  }

最新更新