Phaser游戏开发：实现群体敌人智能追击行为教程-js教程-PHP中文网

Phaser游戏开发：实现群体敌人智能追击行为教程

DDD

发布： 2025-07-07 20:04:10

原创

295人浏览过

Phaser游戏开发：实现群体敌人智能追击行为教程

本教程详细讲解如何在Phaser游戏中为一组精灵（敌人）实现智能追击玩家的行为。我们将纠正常见的代码错误，如静态物理组的使用、错误的精灵迭代方式，并引入Phaser内置的距离计算工具，以确保敌人在特定范围内（例如400像素）能准确地检测并追击玩家，同时优化其移动和动画表现。

在phaser游戏中，为敌人设计智能追击行为是提升游戏体验的关键一环。一个常见的需求是让敌人仅在玩家进入其特定感知范围时才开始追击。本教程将深入探讨如何正确实现这一功能，并解决在开发过程中可能遇到的常见问题。

1. 理解Phaser物理组：静态与动态

Phaser中的物理组（Physics Group）是管理一组物理实体的强大工具。它们分为两种主要类型：

Phaser.Physics.Arcade.StaticGroup (静态组): 适用于不需要移动或受物理影响的对象，如平台、墙壁等。静态组中的物体不会响应重力或速度设置，其位置是固定的。
Phaser.Physics.Arcade.Group (动态组): 适用于需要移动、响应物理交互（如重力、碰撞、速度设置）的对象。敌人精灵通常应属于动态组。

原始代码中将 this.Demons 定义为 staticGroup：

this.Demons = this.physics.add.staticGroup();

登录后复制

然而，后续代码尝试通过 enemy.body.setVelocityX() 和 enemy.body.setVelocityY() 来设置敌人的速度，这与静态组的特性相悖，导致敌人无法移动。

修正方案： 将敌人组更改为动态组。

// 在 create 函数中
this.Demons = this.physics.add.group(); // 将 staticGroup 更改为 group
// ...
// 在生成敌人时，确保它们被添加到这个动态组中
Map.forEachTile(tile => {
    if (tile.index == 6) {
        this.Demons.create(tile.pixelX + 8, tile.pixelY + 8, "demon")
            .play('DemonStand')
            .setSize(22, 30)
            .setOffset(5, 7)
            .setDepth(10);
        // 敌人与地图层的碰撞
        this.physics.add.collider(this.Demons, MapLayer);
        // 敌人与敌人之间的碰撞（可选，如果需要敌人之间相互推开）
        this.physics.add.collider(this.Demons, this.Demons); 
        MonsterCount++;
    }
});

登录后复制

2. 正确遍历精灵组中的活动对象

在Phaser中，Phaser.Physics.Arcade.Group 对象没有 forEachAlive() 方法来直接遍历组中所有活动的子对象。要遍历组中的所有子对象并检查其活动状态，应使用 getChildren() 方法，然后对返回的数组进行迭代。

修正方案： 使用 getChildren().forEach() 并显式检查精灵的 active 属性。

// 在 update 函数中
this.Demons.getChildren().forEach(function (enemy) {
    // 确保精灵是活动的，因为销毁的精灵可能仍然存在于组的子列表中
    if (!enemy.active) {
        return; // 跳过非活动的精灵
    }
    // ... 后续的追击逻辑
});

登录后复制

3. 精确的距离检测与追击逻辑

原始代码中的距离检测逻辑 if (DifferenceX>=400 || DifferenceX

Phaser提供了便捷的数学工具来计算两点之间的距离。Phaser.Math.Distance.BetweenPoints(point1, point2) 是计算两点欧几里得距离的理想选择。

修正方案：

使用 Phaser.Math.Distance.BetweenPoints() 来计算玩家和敌人之间的实际距离。
仅当距离小于指定阈值（例如400像素）时，才执行追击逻辑。
根据玩家和敌人的相对位置设置速度，并处理精灵的动画和方向翻转。

// 在 update 函数中
PlayerX = Player.body.position.x;
PlayerY = Player.body.position.y;

this.Demons.getChildren().forEach(function (enemy) {
    if (!enemy.active) {
        return;
    }

    const enemyX = enemy.body.position.x;
    const enemyY = enemy.body.position.y;

    // 使用 Phaser.Math.Distance.BetweenPoints 计算距离
    const distance = Phaser.Math.Distance.BetweenPoints(
        { x: PlayerX, y: PlayerY },
        { x: enemyX, y: enemyY }
    );

    const EnemySpeed = 100; // 假设 EnemySpeed 已定义，这里给一个示例值

    // 只有当玩家在400像素范围内时才追击
    if (distance < 400) {
        // 计算玩家相对于敌人的方向向量
        const angle = Phaser.Math.Angle.Between(enemyX, enemyY, PlayerX, PlayerY);

        // 设置敌人的速度，使其朝向玩家
        enemy.body.setVelocityX(Math.cos(angle) * EnemySpeed);
        enemy.body.setVelocityY(Math.sin(angle) * EnemySpeed);

        // 根据X轴方向翻转精灵并播放行走动画
        if (PlayerX < enemyX) {
            enemy.setScale(-1, 1); // 向左移动时翻转
        } else {
            enemy.setScale(1, 1); // 向右移动时保持原样
        }
        enemy.play("DemonWalk", true); // 播放行走动画
    } else {
        // 如果玩家超出范围，敌人停止移动并播放站立动画
        enemy.body.setVelocityX(0);
        enemy.body.setVelocityY(0);
        enemy.play("DemonStand", true); // 播放站立动画
    }
});

登录后复制

4. 整合后的完整 update 函数示例

结合上述修正，update 函数中的敌人追击逻辑将更加健壮和高效。

// CREATE GAME SCENE || CREATE GAME SCENE || CREATE GAME SCENE
class GameScene extends Phaser.Scene {
    // ... (preload 和 create 函数保持不变，但请确保 create 中 this.Demons 是 group())

    update() {
        // 获取玩家当前位置
        const PlayerX = Player.body.position.x;
        const PlayerY = Player.body.position.y;
        const EnemySpeed = 100; // 确保 EnemySpeed 在此处或全局定义

        // 遍历所有活动的恶魔敌人
        this.Demons.getChildren().forEach(function (enemy) {
            // 确保敌人是活动的，否则跳过
            if (!enemy.active) {
                return;
            }

            const enemyX = enemy.body.position.x;
            const enemyY = enemy.body.position.y;

            // 计算玩家与敌人之间的距离
            const distance = Phaser.Math.Distance.BetweenPoints(
                { x: PlayerX, y: PlayerY },
                { x: enemyX, y: enemyY }
            );

            // 如果玩家在敌人感知范围内（例如400像素）
            if (distance < 400) {
                // 计算从敌人到玩家的角度
                const angle = Phaser.Math.Angle.Between(enemyX, enemyY, PlayerX, PlayerY);

                // 根据角度设置敌人的速度，使其朝向玩家移动
                enemy.body.setVelocityX(Math.cos(angle) * EnemySpeed);
                enemy.body.setVelocityY(Math.sin(angle) * EnemySpeed);

                // 根据X轴方向翻转敌人精灵，并播放行走动画
                if (PlayerX < enemyX) {
                    enemy.setScale(-1, 1); // 玩家在左边，敌人向左看
                } else {
                    enemy.setScale(1, 1); // 玩家在右边，敌人向右看
                }
                enemy.play("DemonWalk", true); // 播放行走动画
            } else {
                // 如果玩家超出感知范围，敌人停止移动
                enemy.body.setVelocityX(0);
                enemy.body.setVelocityY(0);
                enemy.play("DemonStand", true); // 播放站立动画
            }
        });

        // ... (原有的玩家攻击和移动逻辑)
        //PLAYER ATTACK
        if (this.keys.SPACE.isDown && PlayerAttackTimer == false) {
            PlayerAttack = true;
        }
        if (PlayerAttack == true && PlayerAttackTimer == false) {
            this.time.addEvent({
                delay: 3,
                callback: () => {
                    this.sword.angle += 2;
                },
                repeat: 35
            });
            this.time.addEvent({
                delay: 295,
                callback: () => {
                    this.time.addEvent({
                        delay: 3,
                        callback: () => {
                            this.sword.angle -= 2;
                        },
                        repeat: 35
                    });
                },
            });
            PlayerAttackTimer = true;
            this.time.addEvent({
                delay: 400,
                callback: () => {
                    PlayerAttack = false;
                },
            });
            this.time.addEvent({
                delay: 1500,
                callback: () => {
                    PlayerAttackTimer = false;
                },
            });
        }
        //MOVE PLAYER WITH KEY PRESS
        if (PlayerFlip == true) {
            Player.setSize(-16, 15);
            PlayerWeapon.x = PlayerX - 6;
            PlayerWeapon.y = PlayerY + 6;
        } else if (PlayerFlip == false) {
            Player.setSize(16, 15);
            PlayerWeapon.x = PlayerX + 23;
            PlayerWeapon.y = PlayerY + 6;
        }
        if (this.cursors.left.isDown || this.keys.A.isDown) {
            Player.body.setVelocityY(0);
            Player.body.setVelocityX(-PlayerSpeed);
            Player.setScale(-1, 1);
            this.player.play("walk", true);
            PlayerFlip = true;
        } else if (this.cursors.right.isDown || this.keys.D.isDown) {
            Player.body.setVelocityY(0);
            Player.body.setVelocityX(PlayerSpeed);
            Player.setScale(1);
            this.player.play("walk", true);
            PlayerFlip = false;
        } else if (this.cursors.up.isDown || this.keys.W.isDown) {
            Player.body.setVelocityX(0);
            Player.body.setVelocityY(-PlayerSpeed);
            this.player.play("walk", true);
        } else if (this.cursors.down.isDown || this.keys.S.isDown) {
            Player.body.setVelocityX(0);
            Player.body.setVelocityY(PlayerSpeed);
            this.player.play("walk", true);
        } else {
            this.player.play("stand", true);
            Player.body.setVelocityX(0);
            Player.body.setVelocityY(0);
        }
    }
}

登录后复制

注意事项与优化

性能考虑： Phaser.Math.Distance.BetweenPoints() 内部会进行平方根计算。对于大量敌人，如果仅需比较距离大小而非精确距离值，可以使用 Phaser.Math.Distance.Squared(point1, point2) 来计算距离的平方，然后与 400 * 400 进行比较，这样可以避免开方运算，提升性能。
追击行为复杂化： 当前的追击是直线追击。在更复杂的场景中，你可能需要实现寻路算法（如A*寻路），以避开障碍物。
动画管理： 确保 DemonWalk 和 DemonStand 动画已正确定义。在敌人停止移动时，应播放 DemonStand 动画。
碰撞处理： 确保敌人与地图层、玩家以及其他敌人之间的碰撞逻辑已正确设置，以避免穿透或不自然的交互。
this.physics.moveToObject()： Phaser也提供了 this.physics.moveToObject(gameObject, target, speed, maxTime) 方法，它可以自动计算速度向量使 gameObject 移动到 target。如果你不需要在移动过程中频繁改变方向或执行复杂逻辑，这个方法会更简洁。例如：
```
if (distance < 400) {
    this.physics.moveToObject(enemy, Player, EnemySpeed);
    // 根据X轴方向翻转精灵并播放行走动画
    if (PlayerX < enemyX) {
        enemy.setScale(-1, 1);
    } else {
        enemy.setScale(1, 1);
    }
    enemy.play("DemonWalk", true);
} else {
    enemy.body.setVelocity(0);
    enemy.play("DemonStand", true);
}
```
登录后复制
这种方式可能更简洁，但 moveToObject 默认会一直移动直到到达目标，可能需要额外逻辑来在目标范围内停止。对于持续追击，它是一个很好的选择。