Pixi.js 自定义角色物理系统中跳下平台的碰撞逻辑异常问题求助
Pixi.js 自定义角色物理系统中跳下平台的碰撞逻辑异常问题求助
我现在正在用pixi.js做一款游戏,要给Hero实例实现自定义物理效果,目前卡在了「跳下平台」这个功能上。
我的问题是:当角色处于state === jump状态时应该暂时忽略碰撞,但Pixi.update方法会自动把状态改成state === fall,这时候碰撞检测又生效了,导致跳不下去。
如果把代码里的if (this.#speed.speed > 0 && this.isJump())这段删掉,功能倒是能正常工作,但这样就没法让角色只跳下一层平台,之后的碰撞检测就失效了。
我试过加一个专门的「跳下」状态,也试过用setTimeout(但会导致内存泄漏),还试过用变量做计时器,但这样角色原地跳的时候会出bug。
我把相关代码贴在下面,希望能得到帮助!谢谢!
// Hero 实例代码 update() { this.#speed.speedX = this.#movement.x * this.#speed.maxSpeed; this.x += this.#speed.speedX; if (this.#speed.speedY > 0 && this.isJump()) { console.log('down'); this.#stateHero = $STATESCHARTER.fall } this.#speed.speedY += this.#gravity.gravityForce this.y += this.#speed.speedY } stay() { this.#stateHero = $STATESCHARTER.stay this.#speed.speedY = 0 } jump() { if (this.#stateHero === $STATESCHARTER.jump || this.#stateHero === $STATESCHARTER.fall) return this.#stateHero = $STATESCHARTER.jump this.#speed.speedY -= this.#gravity.jumpForce } jumpDown() { console.log('jump down') this.#stateHero = $STATESCHARTER.jump console.log(this.isJump()) } isJump() { return this.#stateHero === $STATESCHARTER.jump }
// Game 实例代码 isCheckCollision(entity, area) { return entity.x < area.x + area.width && entity.x + entity.width > area.x && entity.y < area.y + area.height && entity.y + entity.height > area.y; } update() { const previousPoint = { x: this.#hero.x, y: this.#hero.y } this.#hero.update() this.#platforms.forEach(platform => { if (this.#hero.isJump()) return const resultCollision = this.resultEntityCollision(this.#hero, platform, previousPoint); if (resultCollision.vertical) { this.#hero.stay(); } }) } resultEntityCollision(charter, platform, previousPoint) { const collisionResult = this.checkResultEntityCollision(charter, platform, previousPoint); if (collisionResult.vertical) { charter.y = previousPoint.y } return collisionResult } checkResultEntityCollision(rectangleA, rectangleB, previousPointRectangleA) { const collisionResult = { horizontal: false, vertical: false, } let isCollision = this.isCheckCollision(rectangleA, rectangleB) if (!isCollision) return collisionResult; rectangleA.y = previousPointRectangleA.y isCollision = this.isCheckCollision(rectangleA, rectangleB) if (!isCollision) { collisionResult.vertical = true return collisionResult } collisionResult.horizontal = true return collisionResult }
备注:内容来源于stack exchange,提问作者yanballas
相关产品推荐
相关产品推荐

