英文:
How the Phaser3 resizes an image
问题
我无法理解预期结果与实际结果之间的差异是什么。
在第一个示例中，我将gui-window的宽度设置为屏幕的宽度，高度设置为屏幕高度的0.3，将其放在屏幕上时，发现部分图像无法适应屏幕。
您可以确保在以下截图中裁剪了gui-window，在将图像添加到场景时，我添加了100像素的填充。
有人能解释为什么Phaser的行为是这样的，以及如何修复吗？
英文:
I can not understand what is the discrepancy between the expected result and what is actually.
In the first example, I set the width of the gui-window to the width of the screen, and the height to 0.3 of the height of the screen, placing this on the screen I found that part of the image didn't fit on the screen.
You can make sure that the gui-window is cropped from the following screenshots, where I added a padding of 100 pixels when adding an image to the scene
Can anyone explain why the Phaser behaves this way and how to fix it?
答案1
得分: 0
The function setDisplaySize just changes the images and distorts it that the image is cut off has probably to do with the passed width and height. The game - scene might be smaller than the window size. Instead of innerHeight / innerWidth you could use this.scene.game.config.height / this.scene.game.config.width, these two properties should return the correct size of the current html-canvas-object.
btw.: if you want to keep the border without distortion, I recommend using nine-slice. Check out this feature (available starting with the version 3.60 and above) link to example
btw.: when posting questions (or answers), it is always better to post the code, and not a screenshot of the code.
英文:
I think the main problem is tht you are not using the function as you should.
The function setDisplaySize just changes the images and distorts it (link to the documentation). that the image is cut off has probably to do with the the passed width and height. The game - scene might be smaller that the window size.
Instead of innerHeight / innerWidth you could use this.scene.game.config.height / this.scene.game.config.width, this two properties should return the correct sze of the current html-canvas-object.
> btw.: if you want to keep the border without distortion, i recommend using nine-slice check out this feature (available starting with the version 3.60 and above) https://labs.phaser.io/view.html?src=src/game%20objects/nine%20slice/create%20nine%20slice.js
> btw.: when posting question (or answers), it is always better to post the code, and not a screenshot of the code.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论