Famo.us Balls拖放，释放时设置速度

Question

我试图通过Famo.us实现类似于空气曲棍球桌效果的东西。我们的想法是让多个圆体可以碰撞（见battle）。

现在我的首要关注点是让球的矢量属性在拖拽开始时归零。

我试图使用＆＃39; reset（）＆＃39;来自Particle.reset的方法，但遇到了大量的问题。这是我到目前为止codepen中的一些代码：

  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);
});

一旦我开始拖拽，任何想法如何最好地将球上的力量归零？另外，我如何确定释放速度相对于用户在发布之前拖动的速度？

Answer 1

您的两个问题的答案都在于从physics engine in Famo.us添加和删除body粒子。

以下是示例代码： jsBin code

注意：此示例并不能解决您的整个解决方案，但会回答您的问题并帮助您达到预期的效果。

一旦我开始拖拽，任何想法如何最好地将球上的力量归零？

不是将力归零，而是暂时从发动机中分离粒子。

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;
    });
  }