javascript - 如何检查一个craftyjs实体是否掉出狡猾的区域？

Question

 <script>
      Crafty.init(450,350, document.getElementById('game'));
     var sledge=   Crafty.e('Floor, 2D, Canvas, Color')
  .attr({x: 0, y: 250, w: 150, h: 10})
  .color('green');

  var hero =Crafty.e('Canvas, 2D, Image, Twoway, Gravity')
  .attr({x: 0, y: 0, w: 50, h: 50})
  .image("jerry.png")
  .twoway(150)
  .gravity('Floor');

    </script>

例如，在这种情况下，我如何得到一个警报，说最后一个实体，英雄已经超出了狡猾的初始化区域？

Answer 1

最简单的方法是比较每个帧的实体位置，如下所示：

hero.bind("EnterFrame", function(e) {
    if (hero.x < 0 
     || hero.y < 0 
     || hero.x > Crafty.viewport._width 
     || hero.y > Crafty.viewport._height) {
        // Whatever logic you're wanting
    }
});

这假设视口是固定的，但这似乎是由问题的性质所暗示的。