ios - 限制 Spritekit 游戏中 GUI 元素的比例

标签 ios sprite-kit size sprite universal

GUI elements example image

我提前向大家道歉,因为帖子太大了,但是每个尝试过制作某种通用应用程序的人都知道这是非常有问题的东西,所以请对我放轻松...

目标

我想要实现的(如上图所示)是在 iPhone 5 和 6 上使用 @2x Assets ,并保持应用程序的相同外观。如果可能的话,在不根据检测到的设备手动计算节点的比例和位置属性的情况下完成所有这些……简而言之,如何实现该应用程序自动约束元素(和场景)之间的比例?此外,我希望使用 @3x Assets 在 iPhone 6+ 上拥有相同外观的应用程序,但由于简单起见,我只专注于 iPhone 5 和 6。

我在网上发现有人说这个(下采样)是由 iOS 自动完成的,例如他们建议这样做:

"Make @2x assets at the size for iPhone 6, and then iOS will do downscaling automatically for iPhone 5".

但是当涉及到 Spritekit 场景时,这显然不是真的,或者我遗漏了什么。

问题

即使 iPhone 6 和 iPhone 5 具有相同的宽高比和相同的 PPI,使用相同的 Assets 与场景大小相比看起来也不一样(与场景大小相比,看第一张和第二张图片上的菜单 Sprite )因为 PPI与像素密度有关,而 iPhone 6 有更多的空间(更大的对角线,更多的英寸),这意味着它比 iPhone 5 有更多的像素。这就是我的问题所在,我不知道什么是有效的方法处理它。

到目前为止我做了什么

第二张图片对于 GUI 来说不是问题,但对于游戏玩法来说,在我的情况下是这样,因为我希望在不同的设备上具有相同的外观和感觉。 只看第一张和第三张图片。

感谢Skyler Lauren's建议我已经设法在 7.1 或 8.1 系统以及 iPhone 6 上的所有 iPhone 5 设备上拥有相同的应用程序外观。所以现在,问题是如何使用 @3x 使此代码适应 iPhone 6+纹理,以及 iPhone 4s。以下是适用于 iPhone 5 和 6 的解决方案:

查看 Controller .m

GameScene *scene = [GameScene sceneWithSize:CGSizeMake(375,677)];//fixed instead of view.bounds.size
 scene.scaleMode = SKSceneScaleModeAspectFill;

因此场景在 iPhone 6 尺寸上始终具有固定大小,而 View 大小根据设备而变化。我正在使用 Assets 目录作为启动图像而不是 xib 文件。图片大小为推荐尺寸 - 4s 为 640x960px,5 为 640x1136px,6 为 750x1334px,6+ 型号为 1242x2208。 Assets 的大小适用于 iPhone 6,因此对于该型号根本没有缩放。

关于4s机型,我在使用上述这种方法时,两边各有两条黑条...

到目前为止,我只在模拟器和 iPhone 6 设备上对此进行了测试(我在设备或模拟器上看到的第一张图片看起来像)。

问题

现在正如我所说,一切都适用于 iPhone 4s(由于宽高比不同,有两个黑条),5、6 使用 @2x Assets ,但是如何使用 @3x Assets 使一切与 iPhone 6+ 一起工作? 如果我为场景使用 375x667 尺寸,那么一切都被正确定位并且具有良好的比例,但质量会受到影响(因为放大@2x)

最佳答案

统一的 GUI 和游戏玩法

据我所知,处理统一的 GUI 和游戏玩法的最佳方法是设置场景大小(无论设备如何)并让 SpriteKit 从那里缩放。

GameScene *scene = [GameScene sceneWithSize:CGSizeMake(375,677)];//fixed instead of view.bounds.size
scene.scaleMode = SKSceneScaleModeAspectFill;

这是 iPhone 6 的点。因为 SpriteKit 以点为单位工作,但设备以像素显示,所以场景大小对于 @2x 设备为 750px x 1354px 像素,对于 iPhone 6+ 为 1125px x 2031px(以像素为单位的设备是实际 1080 x 1920)。

这如何处理 Assets ?

好吧,它对 .atlas 文件夹中的 1x 和 2x 资源非常有效。同样,因为所有内容都转换为点,所以您可以在纹理图集中使用 button.png 和 button@2x.png,并且所有 iPhone 的位置和外观都相同。

@3x 怎么样?

这对 Apple 来说是一个更好的问题。显然 SpriteKit 不支持纹理图集中的 @3x 图像。 SO 上已经有一些问题试图解决这个问题。

一个例子...

Spritekit - not loading @3x images from SKTextureAtlas

它似乎也没有在 Xcode 6.2 中修复。如果您正在阅读这篇文章并想要@3x,那么可能值得向 Apple 提交雷达。需要注意的一件事是,我在文档中没有看到任何地方声称纹理图集应该支持 @3x(或者甚至 @2x)当它们被支持时,您不必对代码进行任何更改.只需将 @3x Assets 放入您的 .atlas 文件夹即可。

我可以/应该如何处理 @3x Assets ?

我的建议是不要担心它并运行 @2x Assets 。 SpriteKit 在缩放图像方面做得不错,并且有很多应用程序不支持 @3x。作为 iPhone 6+ 的同胞,我现在已经学会了忍受它。我希望 Apple 尽快支持 .atlas 文件夹中的@3x 图像。

警告

你要求除 iPhone 6 之外的所有设备都缩小(并放大 iPhone 6+)在大多数情况下,你不应该注意到你的艺术(或我测试的性能)有很大差异,但作为你知道如果你缩小图像,它们看起来可能会略有不同。还有就是4s的黑条问题,暂时没有办法给你解决。

收盘点

如果您设置场景大小并将场景设置为 SKSceneScaleModeAspectFill,您将在所有设备上获得完全相同的应用外观和感觉,但是您要求旧设备缩小。据我所知,它节省了大量时间和计划,但也有一些小缺点。

希望这对您有所帮助,祝您的应用程序好运。

关于ios - 限制 Spritekit 游戏中 GUI 元素的比例,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29198878/

相关文章:

C# - 在 USB FAST 上创建大文件

ios - iOS 11 UIBarButtonItem ImageView大小错误

ios - 如何修剪使用 EZAudioRecorder 录制的音频?

swift - 使节点以相同的速度从不同的起点移动到终点

ios - 在 Sprite Kit 中拖动一个对象与另一个对象碰撞时不会发生弹跳

swift - Sprite Kit 中的单向平台碰撞

flutter - 如何在 Flutter 中将小部件高度填充到父级(或获取父级大小)?

ios - 在 Swift 的函数中将 NSString 转换为 UInt8?

ios - UINavigationController 的 interactivePopGestureRecognizer 不工作

Objective-C:获取文件类型支持的文件扩展名