Phaser 3中玩家与Tiled JSON地图墙体家具层碰撞问题

问题分析 #

你当前的代码中，玩家无法与Paredes（墙体）和Objetos（家具）图层产生碰撞，核心原因是：

• 在Tiled中，你给整个图层添加了collision: true属性，但Phaser的setCollisionByProperty()方法是读取单个瓦片的属性，而非图层属性，因此该方法无法识别图层级的碰撞设置，导致碰撞未启用。
• Suelo图层没有任何碰撞属性，调用setCollisionByProperty()不会产生任何效果，属于无效代码。

修复方案 #

方案1：修改Tiled瓦片属性（推荐） #

1. 打开Tiled编辑器，加载你的地图文件。
2. 分别选中WallsPatron和ForniturePratron瓦片集。
3. 选中需要碰撞的瓦片（比如墙体、家具瓦片），在右侧"瓦片属性"面板中添加collision属性，类型设为bool，值设为true。
4. 重新导出JSON格式的地图文件，替换项目中的旧文件。
5. 代码中保留原有的碰撞设置即可：

this.layers.paredes.setCollisionByProperty({ collision: true });
this.layers.objetos.setCollisionByProperty({ collision: true });

方案2：在代码中强制启用非0瓦片碰撞（无需修改Tiled文件） #

如果不想修改Tiled中的设置，可以直接让Phaser对图层中所有非0瓦片启用碰撞，替换createMap方法中的碰撞设置代码：

// 移除无效的Suelo碰撞设置
// this.layers.suelo.setCollisionByProperty({ collision: true });

// 对Paredes图层，排除ID为0的瓦片（即空瓦片），其余全部启用碰撞
this.layers.paredes.setCollisionByExclusion([0]);
// 对Objetos图层执行同样操作
this.layers.objetos.setCollisionByExclusion([0]);

额外调试建议 #

1. 开启物理调试模式：在Game.js的物理配置中开启debug，直观查看碰撞体轮廓：

physics: {
    default: 'arcade',
    arcade: {
        gravity: { y: 0 },
        debug: true // 开启调试模式
    }
},

2. 检查玩家物理体设置：确保Player类的精灵有正确的碰撞体大小，比如在Player类构造函数中添加：

// 根据你的精灵尺寸调整数值
this.body.setSize(12, 14);
this.body.setOffset(2, 2);

内容的提问来源于stack exchange，提问作者Marta Arevalo