SKSceneのscaleModeとは

SKSceneのscaleModeには以下の４つのモードがあります。

• aspectFill
• aspectFit
• fill
• resizeFill

４つの違いについて解説していきます。

シーンを作成

適当なサイズの.sksファイルを作成。

Scene Editerで以下のような四角形を配置。

これらがiPhoneの画面にどう映るか試してみた。

試してみるデバイスはiPhone11Pro Max(896.0, 414.0)。

    override func viewDidLoad() {
        super.viewDidLoad()
        
        if let view = self.view as! SKView? {
            // Load the SKScene from 'GameScene.sks'
            if let scene = SKScene(fileNamed: "GameScene") {
                // Set the scale mode to scale to fit the window
                scene.scaleMode = .aspectFill
//                scene.scaleMode = .aspectFit
//                scene.scaleMode = .fill
//                scene.scaleMode = .resizeFill
                
//                scene.size = view.bounds.size
                // Present the scene
                view.presentScene(scene)
            }
            
            view.ignoresSiblingOrder = true
            
            view.showsFPS = true
            view.showsNodeCount = true
        }
    }

aspectFill

ノードの上下の余白がなくなった。

aspectFit

上下左右の余白残っている。

シーンエディタの配置イメージに１番近いのはこれではなかろうか。

fill

縦方向が潰されて歪んでしまった。

アスペクトを維持できていない。スマホ画面に無理やり押し込んだ感じ。

resizeFill

スマホのサイズ分だけ、シーンの中央が切り取られた。

SceneをViewのサイズに合わせる方法

以下のコードでシーンのサイズをViewのサイズに変更できる。

scene.size = view.bounds.size

aspectFillにして上記のコードを実行した場合の結果は以下の通り。

今回のようにスマホの画面よりもシーンの方が大きい場合、スマホの画面分だけ切り取られた。

まとめ

シーンをViewにセットする時にはaspectFitが良いと思う。