Estoy usando Matter.js para algunos gráficos y quiero este rectángulo.
let title = Bodies.rectangle(w / 2.4, height / 1.8, 300, 100, { isStatic: true, }) para obtener isStatic: false y caer cuando es golpeado por algunos círculos que llueven sobre él. He buscado mucho en Google, pero realmente no he encontrado nada más que esto:
Events.on(engine, 'collisionStart', function (event) { event.pairs.forEach(function (obj) { console.log( 'BodyA is static: ' + obj.bodyA.isStatic + '. BodyB is static: ' + obj.bodyB.isStatic ) }) }) Esto me da todas las colisiones que ocurren, pero no he descubierto cómo configurar isStatic: false cuando algo golpea. ¡Aprecio tu ayuda!
Puede llamar a Matter.Body.setStatic(body, false) en el cuerpo en cuestión para activarlo.
Aquí hay un ejemplo:
const engine = Matter.Engine.create(); const render = Matter.Render.create({ element: document.body, engine, options: {width: 400, height: 400, wireframes: false}, }); const fallingBody = Matter.Bodies.rectangle( 200, 0, 20, 20, { frictionAir: 0.1, density: 0.8, render: {fillStyle: "red"}, }, ); const wall = Matter.Bodies.rectangle( 200, 150, 400, 20, { frictionAir: 0.05, isStatic: true, render: {fillStyle: "green"} }, ); Matter.Composite.add(engine.world, [fallingBody, wall]); Matter.Events.on(engine, "collisionStart", event => { if (wall.isStatic && event.pairs.some(e => Object.values(e).includes(wall))) { Matter.Body.setStatic(wall, false); } }); Matter.Render.run(render); Matter.Runner.run(Matter.Runner.create(), engine); <script src="https://cdnjs.cloudflare.com/ajax/libs/matter-js/0.18.0/matter.min.js"></script>