如何在相机跟随角色的横版卷轴游戏中让分数和等级固定显示在屏幕上

你使用的是Kaboom.js引擎，要实现UI固定在屏幕视口不受相机移动影响，只需要给UI组件添加fixed()组件即可，该组件会将对象的坐标从世界坐标系切换为视口坐标系，坐标原点始终对应屏幕左上角，不受世界相机位移影响。

修改后的代码如下：

const scoreLabel = add([
    text(score),
    pos(15, 6),
    layer('ui'),
    fixed(), // 新增固定视口属性
    {
        value: score,
    }
])

add([
    text('level' + parseInt(level + 1)),
    pos(40, 6),
    layer('ui'),
    fixed() // 同样新增固定属性
])

补充说明：

• 如果你使用的是较旧版本的Kaboom.js，fixed()对应的API为stay()，替换即可生效
• 如果你有大量UI元素需要固定，也可以直接给ui层统一配置固定属性，无需给每个组件单独加fixed()
• 后续新增暂停按钮、血条等常驻屏幕的元素，都可以通过加fixed()实现视口固定

内容的提问来源于stack exchange，提问作者Elliot Virggo