Matter.js碰撞未检测
问题描述:
我正在尝试使用matter.js来创建自上而下的级别炸弹人风格。Matter.js碰撞未检测
现在我想要得到我的圈子,这是由箭头键控制移动和碰撞到静态广场,但它只是通过他们。我错误地设置了它吗?我已经编了三个月的编码,所以我可能会很抱歉!
var Engine = Matter.Engine,
World = Matter.World,
Bodies = Matter.Bodies;
var engine = Engine.create();
var world = engine.world;
var player;
var rocks = [];
var cols = 7;
var rows = 7;
function setup() {
createCanvas(750, 750);
Engine.run(engine);
player = new Player(300, 300, 25);
var spacing = width/cols;
for (var j = 0; j < rows; j++) {
for (var i = 0; i < cols; i++) {
var r = new Rocks(i * spacing, j * spacing);
rocks.push(r);
}
}
}
function draw() {
background(51);
Engine.update(engine);
for (var i = 0; i < rocks.length; i++) {
rocks[i].show();
}
player.show();
player.move();
}
function Player(x, y, r) {
this.body = Bodies.circle(x, y, r);
this.r = r;
World.add(world, this.body);
this.show = function() {
ellipse(x, y, this.r * 2);
}
this.move = function() {
if (keyIsDown(RIGHT_ARROW))
x += 10;
if (keyIsDown(LEFT_ARROW))
x -= 10;
if (keyIsDown(UP_ARROW))
y -= 10;
if (keyIsDown(DOWN_ARROW))
y += 10;
x = constrain(x, this.r, height - this.r);
y = constrain(y, this.r, width - this.r);
}
}
function Rocks(x, y, w, h, options) {
var options = {
isStatic: true
}
this.body = Bodies.rectangle(x, y, h, w, options);
this.w = w;
this.h = h;
this.size = player.r * 2;
World.add(world, this.body);
this.show = function() {
rect(x, y, this.size, this.size);
}
}
答
我认为问题是,你的球员是不是在相同的位置得出的物理引擎认为它的。
在您的播放器函数初始化后x和y其余全部需要为this.body.position.x
和this.body.position.y
。否则,你正在改变画面的位置,而不是玩家的实际位置。
我不完全确定你想让我指出什么,除此之外,但我想你想禁用与engine.world.gravity.y = 0
引力,我试图修复约束功能,因为当我测试它不工作,我无法修复它,但我建议仅为墙壁制作静态边界对象,而不要绘制它们。
另外,matter.js处理对象从其中心的位置。当绘制对象,你要么必须考虑到这一点或模式切换为ellipseMode(CENTER);
,“rectMode(中心);`..等
我希望这有助于