Javascript js startCollision事件不起作用

我是matter js新手，正在尝试使用react-native、react-native游戏引擎和matter js构建一个简单的游戏

游戏是圆出现在屏幕上，他们正在成长。用户需要在它们彼此接触之前弹出它们。我让气泡不断长大，并建立了自己的碰撞检测方法。但是，它不能完美地工作，气泡会有一点重叠，或者几乎不接触，碰撞检测就会触发。我看到Matter js有一个内置的身体碰撞检测，但我不知道如何让它工作，代码如下：

当气泡增长和碰撞时，我认为它会触发createWorld中的

startCollision

回调

谢谢大家的支持

渲染游戏引擎

return (<GameEngine style={styles.container}
                        ref={(ref) => {
                            this.GAME_ENGINE = ref;
                        }}
                        running={running}
                        onEvent={this.onEvent}
                        systems={[Physics, this.AddCircles, this.PopBubble, this.GrowCircles, this.CheckCollision]}
                        entities={this.createWorld()}/>)

添加圆圈

AddCircles = (entities: any, {touches, screen, layout, time}: any) => {

    if (!this.canAddNewCircle(time)) {
        return entities;
    }

    let available = false;
    let ranX = Math.round((Math.random() * screen.width * .8) + (screen.width * .1) - this.BOX_SIZE);
    let ranY = Math.round((Math.random() * screen.height * .8) + (screen.height * .1) - this.BOX_SIZE);

    // Attempted to use isSensor, still does not work.
    const body = Matter.Bodies.circle(ranX, ranY, this.BOX_SIZE, {isStatic: true, isSensor: true});
    const id = `circle-${Math.random() * 1000}`;

    entities[id] = {
        body: body,
        originalX: ranX,
        originalY: ranY,
        size: [this.BOX_SIZE, this.BOX_SIZE],
        color: this.circleIdSet.size % 2 == 0 ? "pink" : "#B8E986",
        renderer: Bubble
    };

    Matter.World.addBody(entities.physics.world, body);

    this.circleIdSet.add(id);
    this.setState({timeSinceLastCircleAdd: time.current});
    return entities;
}

GrowCircles = (entities: any, {touches, screen, layout, time}: any) => {

    let circle;
    this.circleIdSet.forEach((key: any) => {
        circle = entities[key];
        Matter.Body.set(circle.body, "circleRadius", circle.body.circleRadius + .2)
        Matter.Body.setPosition(circle.body, {
            x: circle.originalX - circle.body.circleRadius,
            y: circle.originalY - circle.body.circleRadius
        });
    });

    return entities;
}

增加圈数

AddCircles = (entities: any, {touches, screen, layout, time}: any) => {

    if (!this.canAddNewCircle(time)) {
        return entities;
    }

    let available = false;
    let ranX = Math.round((Math.random() * screen.width * .8) + (screen.width * .1) - this.BOX_SIZE);
    let ranY = Math.round((Math.random() * screen.height * .8) + (screen.height * .1) - this.BOX_SIZE);

    // Attempted to use isSensor, still does not work.
    const body = Matter.Bodies.circle(ranX, ranY, this.BOX_SIZE, {isStatic: true, isSensor: true});
    const id = `circle-${Math.random() * 1000}`;

    entities[id] = {
        body: body,
        originalX: ranX,
        originalY: ranY,
        size: [this.BOX_SIZE, this.BOX_SIZE],
        color: this.circleIdSet.size % 2 == 0 ? "pink" : "#B8E986",
        renderer: Bubble
    };

    Matter.World.addBody(entities.physics.world, body);

    this.circleIdSet.add(id);
    this.setState({timeSinceLastCircleAdd: time.current});
    return entities;
}

GrowCircles = (entities: any, {touches, screen, layout, time}: any) => {

    let circle;
    this.circleIdSet.forEach((key: any) => {
        circle = entities[key];
        Matter.Body.set(circle.body, "circleRadius", circle.body.circleRadius + .2)
        Matter.Body.setPosition(circle.body, {
            x: circle.originalX - circle.body.circleRadius,
            y: circle.originalY - circle.body.circleRadius
        });
    });

    return entities;
}

---

在创建实体时，您设置isSensor=true
当你这样做的时候，碰撞不会检测到 试试下面的代码

const body = Matter.Bodies.circle(ranX, ranY, this.BOX_SIZE, {isStatic: true, isSensor:false});

---

如果你想定制检测碰撞

将MJS带到这里，感觉就像使用航天飞机烤西葫芦一样。检测圆对圆碰撞是非常困难的。您可以使用一个简单的画布，用

ctx.arc

绘制圆圈，最后得到比这更少的代码。您需要使用MJS有什么特别的原因吗？通常，问题是渲染与MJS的世界观不匹配，所以这是第一件要检查的事情。我也有这种感觉，但我想我会用它来学习。