javascript - PixiJS 调整渲染器大小但保持比例？

Question

我正在使用 PIXI.JS 制作一款使用详细像素艺术的游戏。我想设计垂直方向的游戏(非常适合智能手机)，但我也希望它能够适合浏览器窗口，并且其比例完好无损。我还需要所有内容都能够扩展并保持完整。

谁能帮忙解决这个问题吗？我做了太多的研究，我的头开始疼了，而且我觉得我还没有走得太远。

Answer 1

在 pixi 中调整渲染器的大小实际上非常容易。只需初始化一个渲染器即可。例如(需要 ID 为“renderer”的 Canvas ):

var renderer = PIXI.autoDetectRenderer(width, height, {antialias: false, transparent: false, resolution: 1, view: document.getElementById("renderer")});

然后决定根据需要调整渲染器的大小:

renderer.resize(newWidth, newHeight);

参见https://pixijs.github.io/docs/PIXI.WebGLRenderer.html供引用。