javascript - Kaboom.js : how to set the background to an image

标签 javascript 2d-games kaboom

我正在制作一个 kaboom.js 游戏,我想将场景的背景设置为图像。我只能找到将背景更改为颜色的解决方案。我希望有人能帮帮忙!

最佳答案

在 Kaboom.js 中,没有对背景图像的特殊支持。但是,您可以使用带有 Sprite 组件的常规游戏对象作为背景图像。这是一个简单的例子:

async function init() {
  kaboom();
  let bgImage = await loadSprite("background", "https://www.paulwheeler.us/files/windows-95-desktop-background.jpg");

  let background = add([
    sprite("background"),
    // Make the background centered on the screen
    pos(width() / 2, height() / 2),
    origin("center"),
    // Allow the background to be scaled
    scale(1),
    // Keep the background position fixed even when the camera moves
    fixed()
  ]);
  // Scale the background to cover the screen
  background.scaleTo(Math.max(
    width() / bgImage.tex.width,
    height() / bgImage.tex.height
  ));
}

init();
<script src="https://cdn.jsdelivr.net/npm/kaboom@2000.1.8/dist/kaboom.js"></script>

关于javascript - Kaboom.js : how to set the background to an image,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70559159/

相关文章:

javascript - 防止 Sql 注入(inject),但按页面上的原样显示发布的数据

javascript - 如何在 JavaScript 中调用原型(prototype)之外的函数?

javascript - 如何在范围外更改 AngularJS 数据?

javascript - LightSwitch HTML 客户端无需刷新整个页面即可自动运行查询

JavaFX Canvas 双缓冲

Javascript 游戏代码运行速度非常慢

android - 将项目从 2018.1.6f1 迁移到 2019.2.1f1。统一启动画面后 Android 应用程序崩溃