PhaserJS:为图形对象添加物理

时间:2014-05-04 06:11:16

标签: javascript game-engine game-physics phaser-framework

大多数示例使用精灵来添加物理,但我想将物理添加到使用Graphics类创建的对象。例如:

var square = game.add.graphics( 0, 0 );
//some definitions

game.physics.arcade.enable( square );

这对于图形来说根本不起作用,但它会立即使用精灵。为什么这样,我怎么能实现这个目标?

提前致谢。

2 个答案:

答案 0 :(得分:8)

我不得不调查很多,因为它似乎不是标准(至少是教程),但你必须创建一个BitmapData对象并使用画布来绘制数字。这并不像使用game.add.graphics创建圆圈和poligons等那样有趣,但效果很好。

这是您创建平台的方式:

//creates the BitmapData object, you can use it to create figures:
var floor = game.add.bitmapData( 400, 20 ); //width, height

//this fills the whole object with a color:
floor.fill( 200, 100, 0, 1 ); //Red, Green, Blue, Alpha
//floor will have a canvas context object to draw figures. 
//Here are some more examples:
//http://www.html5canvastutorials.com/tutorials/html5-canvas-circles/

//after you finish drawing, you need to convert the object to a sprite:
var floorSprite = game.add.sprite( 100, 500, floor );

//this adds physics to the object and adds a .body property:
game.physics.arcade.enable( floorSprite );

//stops the object in place and prevents other objects from displacing it:
floorSprite.body.allowGravity   = false;
floorSprite.body.immovable      = true;

这就是如何在不依赖图像文件的情况下创建平台的方法。我看过一些教程使用文件而不是生成平台,我认为这是一种浪费。

另外,我认为你需要将你的矢量转换为位图是因为矢量物理在硬件上相当沉重(或者看起来如此)。

希望这可以帮助更多的人!

答案 1 :(得分:0)

也许它适用于此:

anySprite.addChild(yourGraphicsObject);

之后:

game.physics.arcade.enable(anySprite);