SpriteKit - 获取缩放场景上可见区域的实际大小/帧.AspectFill [英] SpriteKit - Getting the actual size/frame of the visible area on scaled scenes .AspectFill

问题描述

我一直在SpriteKit制作游戏，在支持所有屏幕尺寸时遇到了问题。我尝试通过将所有场景缩放模式设置为.AspectFill并为所有宽度为480且高度为800的屏幕设置固定大小来解决此问题，如下所示：

I have been making a game in SpriteKit and I have come into a problem when supporting all screen sizes. I attempted to resolve the problem by setting all my scenes scale modes to .AspectFill and setting a fixed size for all screens with a width of 480 and a height of 800 as shown:

让scene = GameScene（大小：CGSize（宽度：480，高度：800））

let scene = GameScene(size:CGSize(width: 480, height: 800))

我去添加一个与游戏场景边缘对齐的边框（SKShapeNode），我发现self.frame.width和self.frame.height不会给设备的显示尺寸区域即可。经过一些研究后，我通过使用UIScreen.mainScreen（）。bounds.height和UIScreen.mainScreen（）。bounds.width发现了很多建议。我实现了这种获取可见屏幕尺寸的方式，它仍然给我的尺寸与播放器可见的场景的实际尺寸不匹配。

I went to add a border (an SKShapeNode) that aligns to the edges of the game scene and I found that self.frame.width and self.frame.height aren't don't give the dimensions for the device's visible area. After a bit of research I had discovered a lot of suggestions by using UIScreen.mainScreen().bounds.height and UIScreen.mainScreen().bounds.width. I implemented this way of getting visible screen dimensions instead and it still gave me dimensions that didn't match the actual size of the scene of which is visible to the player.

我不确定这是否与我的所有场景有关，无论设备的分辨率是否具有固定的宽度和高度，并使用.AspectFill进行缩放。我一直坚持支持所有屏幕尺寸一段时间的问题，我不确定如何去做。如果它有助于我使用矢量图形文件而不是PNG。
所以我的问题是：
有没有快速的方法来支持所有的屏幕尺寸，或者我是否必须在我的场景中为每个设备硬编码每个节点的坐标？我不明白为什么这会是解决方案，因为它似乎太乏味而且代码看起来很混乱。

I am unsure if it has anything to do with the fact that all my scenes no matter the device's resolution have a fixed width and height and are scaled using .AspectFill. I have been stuck on the problem of supporting all screen sizes for a while now and I am unsure of how to go about it. If it helps I am using vector graphic files rather than PNG's. So my questions are: Is there any quick way of supporting all screen sizes or do I have to resort to hardcoding the coordinates of every node on my scenes for every device? I can't see why this would be the solution as it seems too tedious and the code would look messy.

我还询问如何获得一个矩形/框架，在场景缩放后给出设备上场景可见区域的尺寸？

I am also asking about how to get a rectangle/frame that gives the dimensions of the scenes visible area on a device after the scene has been scaled?

如果我之前曾问过我的任何一个问题，我很抱歉，但我找到的每个答案都没有特别解决我的问题，或者写得太乱了。我想我已经提供了足够的信息来解决这个问题，但是如果我还没有请求我提供所需的信息。

I am sorry if either of my questions have been asked before but every answer I find either doesn't solve my problem specifically or seems too messy to write. I think I have given enough information towards the problem but if I haven't please ask me for the required information.

非常感谢你，感谢任何帮助

Thank you so much and any help is appreciated

推荐答案

以下是Aspect Fill的工作原理：

Here is how Aspect Fill works:

场景的尺寸将永远保持不变，所以如果你说你的场景是480点乘800点，它将始终保持这种方式，无论设备如何。

The dimensions of your scene will always remain the same, so if you say your scene is 480 points by 800 points, it will always remain that way regardless of device.

然后会发生什么呢？它将从 SKView 的中心开始缩放场景，直到它填满最远的墙壁。

What then happens is it will scale the scene starting from the center of the SKView until it fills the farthest walls.

这将反过来裁剪你的场景。

This will in turn crop your scene.

因此，在设计不同宽高比的游戏时，你需要设计你的游戏来处理裁剪。

So when designing your game across the different aspect ratios, you will need to design your game to handle cropping.

现在，在您的特定情况下，您需要弄清楚设备的宽高比，并消除与场景方面的差异。

Now in your particular case, You will need to figure out what the aspect ratio is for the device, and work off the difference from the scene aspect.

E.G。您的场景是3x5，设备是9x16，这意味着您的设备将增长到9.6x16，以填充9x16设备的大小。我们得到这个是因为我们的高度比我们的宽度有更多的距离，所以我们需要做3/5 = a / 16,3 * 16 = a * 5，（3 * 16）/ 5 = a所以a = 9.6。

E.G. Your scene is 3x5, device is 9x16, This means your device is going to grow to become 9.6x16 to fill up to the size of your 9x16 device. We get this because our height has more distance than our width, so we need to do 3/5 = a/16, 3*16 = a * 5, (3*16)/5 = a so a = 9.6.

这意味着你的场景宽度为.6，两边都是.3。

This means you have .6 of cropping to your scene on the width, .3 on both edges.

现在你要问，.3与各种屏幕尺寸有什么关系。

Now you are going to ask, How does the .3 relate to the various screen sizes.

嗯我们需要弄清楚.3是9.6的百分比。我们用分区来做，.3 / 9.6 = .03125或3.125％;这意味着我们需要将3.125％的边界推向场景的宽度，即15点。这意味着.03125 * 480 = 15.你的边界应该从15宽度和465开始。

Well we need to figure out what percentage .3 is of 9.6. We do that with division, .3/9.6 = .03125 or 3.125%; This means we need to push our border in 3.125% in the scene's width, which is 15 points. That means .03125 * 480 = 15. Your borders should then start at 15 width and at 465.

伪代码：

let newSceneWidth = (scene.width * view.height) / (scene.height)
let sceneDifference = (newSceneWidth - view.Width)/2
let diffPercentage = sceneDifference / (newSceneWidth)

let leftEdge = diffPercentage * scene.width;
let rightEdge = scene.width - (diffPercentage * scene.width);

现在，如果高度上的距离比宽度更大，则必须交换宽度和高度变量。

Now if there is more distance to scale in the height than the width, you would have to swap the width and height variables.

这篇关于SpriteKit - 获取缩放场景上可见区域的实际大小/帧.AspectFill的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！