By: Mark Johnson @mellowcoder
Configuring a Landscape Only Game Using SpriteKit
When we began developing our first game in SpriteKit we started out the same way that I suspect most everyone else does. Open up Xcode and create a new game using the SpriteKit framework template. The simple default app that is created worked fine when I ran it in the simulator. But, I wanted my app to only run in landscape and the default app comes up in portrait view and is configured to support both orientations.
So, I update the target Deployment Info, unchecking the portrait options and ran the demo app again. Everything looks fine so I think I am good to go.
The Problem
Next, I remove the existing scene setup code and start adding my background sprites to build up my scene. My first background sprite should be located in the lower left corner of the screen so I position it there and run the simulator. But, when the simulator comes up the image is on the far left but it is below the bottom of the screen.
I add some log statements to look at the size of the view and the size of the screen and in each case it reports the size as if it was in portrait orientation rather then landscape.
One Option is to use viewDidLayoutSubviews
One option to address this problem is to add a “viewDidLayoutSubviews” method to your view controller and then add your code to present your scene inside this method. The viewDidLayoutSubviews method is the recommended place to put any geometry related code. It is called after the system has completed any auto-layout items. This means, in addition to the initial presentation of the view, it will also be called anytime the device orientation changes and the view auto-rotates. If you are supporting both portrait and landscape orientations and need to manually adjust the layout when the orientation changes, you should put that code here. If you do add your code to present the scene, you will need to ensure that it only runs the first time the scene is loaded. But, for the initial setup and presentation of the scene, I think there is a simpler solution.
A Simpler Solution for Landscape only orientation
Simply, update the SKScene scaleMode that is defined in the view controller. The SpriteKit template sets up the scaleMode as “SKSceneScaleModeAspectFill”. Instead, you should change this to “SKSceneScaleModeResizeFill”. Now if you run the simulator you will see that the background image is correctly positioned. Please see last weeks post, SpriteKit – Understanding SKScene scaleMode, for a more detailed discussion of the different SKScene scale modes.
scene.scaleMode = SKSceneScaleModeResizeFill;
The only other thing to be concerned with is getting the correct width and height to use for the scene. I get the bounds for the mainScreen. This always returns the dimensions based on the portrait orientation so, I simply swap the width and height to get the size in landscape.
CGRect screenRect = [[UIScreen mainScreen] bounds]; float landscapeWidth = screenRect.size.height; float landscapeHeight = screenRect.size.width;
This is a simple straightforward approach to setup a game that is only intended to support landscape orientation. The following is a screen shot of the one of the backgrounds for the game we are working on. This background is made up of numerous images with their positions adjusted relative to the top, bottom, left and right so that we can handle both iPhone and iPad devices.
