SpriteKit - How do I handle multiple screen sizes?

Question

My new game is finished and now I'm just testing on multiple real devices. I came across multiple issues after testing. The big issue is how to handle screen sizes. The game is how I want it to look on 6 Plus/6s Plus, but not on 6s, 6, 5s, 5, 4s, 4, or iPad.

I found these two answers but I don't know how to implement them: How to support multiple screen sizes in SpriteKit? and SpriteKit how to get correct screen size

I really would like any type of help, because this is irritating me.

Does simply checking the screen size, and then manually adjusting each node's size not working or..? — dannybess, Feb 08 '16 at 04:36
Although you met the character limit for this post it's still extremely long for a question. Can you summarize the majority of the code? Most of what is here is not needed to convey the issue. — , Feb 08 '16 at 04:50
@dannybess For what ever reason, I don't know why I didn't think of that. I found my answer here: http://stackoverflow.com/a/33953003/3926691 — behind the aura, Feb 08 '16 at 05:00
@KennethBruno Although I ended up finding my answer thanks to dannybess reminding me of check the screen sizes, I will sum up the question for others who may come across my question for answers. — behind the aura, Feb 08 '16 at 05:03

crashoverride777 · Answer 1 · 2020-06-18T21:26:25.360

Its quite a commonly asked question.

What we usually do in SpriteKt is to give the SKScene a fixed size and let SpriteKit do the scaling for you on different devices.

So basically we have 2 ways to do it correctly

1) Set scene size to iPad (e.g 1024x768 -landscape, 768x1024 - portrait). This was the default setting in Xcode 7.

You than usually just have/show some extra background at the top/bottom (landscape) or left/right (portrait) on iPads which gets cropped on iPhones.

Examples of games that show more on iPads / crop on iPhones:

Altos Adventure, Leos Fortune, Limbo, The Line Zen, Modern Combat 5.

2) Apple changed the default scene size in xCode 8 to iPhone 6/7 (750*1334-Portait, 1337*750-Landscape). This setting will crop your game on iPads.

Examples of games that show less on iPads:

Lumino City, Robot Unicorn Attack

Choosing between those 2 options is up to you and depends what game you are making. I usually prefer to use option 1 and show more background on iPads.

For scale mode it is usually best to either use .aspectFill or .aspectFit.

You would use the Universal asset slot and/or device specific images. This way you will have a consistent experience on all devices

Spritekit scale full game to iPad

How to make SKScene have fixed width?

Hope this helps

score 2 · Answer 2 · answered Mar 01 '18 at 19:47

In my case I have a portrait game, and I want to keep the height fixed while showing more or less content left/right depending on the device's screen.

For that in Xcode's Scene Editor I added and set an SKCameraNode for my scene, and set the scene size to the "widest" aspect ratio device (iPhone X ), that is 2436x1125 pixels.

Then set a custom class for the scene and override sceneDidLoad:

override func sceneDidLoad()
{
    super.sceneDidLoad()

    self.size.width = self.size.height * (UIScreen.main.bounds.size.width / UIScreen.main.bounds.size.height)
    self.scaleMode = .aspectFit
}

If I want to preview how my game will look in the "narrowest" device (any iPad has a 1.5:1 ratio) I just temporarily change my scene's width to around 1500 pixels.

Note: SKView's contentMode changes nothing.

score 1 · Answer 3 · edited May 23 '17 at 12:01

I was reminded of checking the screen size and changing the node sizes, I found this as an answer: how to check screen size of iphone 4 and iphone 5 programmatically in swift

All I had to add was this in my GameScene and it was called in every .swift:

extension UIScreen {

enum SizeType: CGFloat {
    case Unknown = 0.0
    case iPhone4 = 960.0
    case iPhone5 = 1136.0
    case iPhone6 = 1334.0
    case iPhone6Plus = 1920.0
}

var sizeType: SizeType {
    let height = nativeBounds.height
    guard let sizeType = SizeType(rawValue: height) else { return .Unknown }
    return sizeType
}
}

And this

if UIScreen.mainScreen().sizeType == .iPhone4 {
// Make specific layout for small devices.
}

@DavinTryon I undeleted the post after editing my answer. I clarified what I did to solve my answer and remove the "Thanks to..." part. Also if you don't mind, can I ask you a different question? — behind the aura, Feb 09 '16 at 18:43

SpriteKit - How do I handle multiple screen sizes?

3 Answers3