javascript - 具有 2 个重力的狡猾元素

Question

我正在尝试理解 Crafty。这是我的代码。

Crafty.init(500,300, document.getElementById('game'));

Crafty.e('Floor, 2D, Canvas, Color')
  .attr({x: 0, y: 250, w: 200, h: 10})
  .color('green');

Crafty.e('SecondFloor, 2D, Canvas, Color')
  .attr({x: 250, y: 230, w: 200, h: 10})
  .color('red')

Crafty.background('#FFFFFF url(http://samenvattingleren.nl/img/img2.jpg) no-repeat center center');

Crafty.e('2D, Canvas, Color, Fourway, Gravity')
  .attr({x: 25, y: 5, w: 50, h: 50})
  .color('orange')
  .fourway(4)
  .gravity("Floor")
  .bind('KeyDown', function(e) {
    if(e.key == Crafty.keys.LEFT_ARROW) {
    this.x = this.x - 1;
    } else if (e.key == Crafty.keys.RIGHT_ARROW) {
        this.x = this.x + 1;
    } else if (e.key == Crafty.keys.UP_ARROW) {
    this.y = this.y - 1;
    } else if (e.key == Crafty.keys.DOWN_ARROW) {
    this.y = this.y + 1;
    } else if (e.key == Crafty.keys.ESC) {
        this.x = 0;
    }
  })

我要添加

Crafty.e('2D, Canvas, Color, Fourway, Gravity')
      .attr({x: 25, y: 5, w: 50, h: 50})
      .color('orange')
      .fourway(4)
      .gravity("Floor")
      .gravity("SecondFloor") //This is what i want to add

但这不起作用。广场仍然穿过二楼

Answer 1

“地板”组件应被视为一种标签，您可以将其添加到任何应充本地板的实体中。在您的示例代码中，似乎没有必要区分“Floor”和“SecondFloor”，因此您只需将后者更改为“Floor”即可。

如果你有两个custom components如果您希望始终充本地板，解决方案是让它们自动需要“地板”组件。例如

Crafty.c("IcePlatform", {
    init: function(){ this.requires("Floor"); }
    // Stuff specific to "IcePlatform"
};

Crafty.c("MovingPlatform", {
    init: function(){ this.requires("Floor"); }
    // Stuff specific to "MovingPlatform"
};

然后，每当任何具有“MovingPlatform”或“IcePlatform”的实体也将充当“Floor”，并与重力进行适当的交互。