I just add an iAd banner to my sprite kit game but it deform the scene because there are balloons in my scene and with iAd banner the balloons are not rounded anymore.
So what I did is to change the property from
SKSceneScaleMode.AspectFill
to
SKSceneScaleMode.AspectFit
So the balloons look rounded again but I have vertical black strips at the left and the right of my scene.
Any solution to remove the black strips ? or to keep rounded balloons with aspectFill ?
Thank you ! SDK iOS 8, Xcode 6.4
You added the iAd banner. It has fixed height. To still keep all of your scene visible iOS has to scale the size of your scene. AspectFill will just make the Scene fit the view, and resizes it also not proportional.
AspectFit uses an proportional scale so there must be space on the left and the right. The only thing you can do to avoid black spaces and keep the scene proportinal.
The only thing you can do is to resize the scene:
[MyScene sceneWithSize:CGSizeMake(skView.bounds.size.width, skView.bounds.size.height - 50)];
(Assuming the iAd banner is 50pt)
Related
I am developing a sample game using SceneKit and Swift in Xcode, I added a ship node (default) and add some animations. The problem is that the sceneView does not fit the screen because the aspect ratio does not seems to bee 16:9 as the screen of an average iPhone screen size. How can I scale the sceneView to fit the screen?
I found out that the best way of solving this issue was to set the Launch Screen File = Main
My scene is set to be .AspectFit. I have camera node in scene center and it is connected. Everything works fine for iPad landscape, but when I rotate simulator or run in different device then iPad in landscape camera is not centred. Why?
This is for landscape with camera on center:
After rotation camera is not centred:
Similar issue is for e.g. for landscape iPhone5s:
Why is camera shifted with scene setting .AspectFit with other device then iPad in landscape?
You can try out or experiment with this project on bitbucket I made.
EDIT: When I don't use camera, everything is on its place.
Set the scene anchor point to 0.5, 0.5 to center your camera onto the scene , there is an issue with the view to scene conversion, and will draw in the top left corner instead of the center. (Also, you will notice your hello world is off, this is because it is not accounting for the anchor change)
Perhaps the lack of a camera will make the scene translate where it draws to inside of the black bars, I have no idea.
Is there a bug in SKCameraNode when used with .AspectFill on devices where the aspect ratio of the SKScene does not match that of the devices view?
I have a minimal demo of the issue I see: an SKScene created in an SKS file, to be 768w x 1024h, filled with an image (also 768w x 1024h). It's loaded with .AspectFill. An SKLabel is positioned in the middle of the scene programmatically. The demo is simply the out-of-the-box iOS template for a SpriteKit game, with a background image added.
An iPad in Portrait (so 768w x 1024h) displays this fine. An iPhone 6+ in Portrait (414w x 736h) displays fine. An iPhone 5S (320w x 568h) displays fine.
If I add a camera to the scene, position it in the middle by setting its coordinates to (384, 512) in the SKS file and set the scene to use it, the iPad is fine but now the iPhones (and any other device with a aspect ratio other than 3:4) does NOT work. It displays the right-hand side of the scene. It is not centered. Screen shot from the iPhone below.
The camera being in the middle of the scene, should ALWAYS work.
I am currently using a work-around. When you use .AspectFill the sides of the scene are cropped by an amount - let's call it cropAmount - to fit on the narrower screen. The work-around is to move the camera left, so it is off-center by cropAmount, then the scene displays correctly.
The background image here is an #3x of a 768w x 1024h background for my game. I've put in green the cropAmount corresponding to the SKView for 9:16, and in red the scene bounds. Given the camera is set in the middle of the scene, same as the label and the pink dot in the middle of the image, why is the center of the view not also there?
If this is a bug, and I leave in my "fix" where I offset the camera by cropAmount, later updates could break production code running on devices.
Also I am not using .ResizeFill as it doesn't fix the camera node issue, and would also mean that the assets are incorrectly sized and positioned in the scene for the thousands of lines of code and dozens of SKS files I already have over 6 months of work.
Question has been edited. Originally I had my "fix" added as an extension but this just caused confusion so I have removed it.
I'm creating universal game for all iOS devices in portrait mode using Swift. In GameViewController I'm creating scene like this:
let scene = GameScene(size:CGSize(width: 1536, height: 2048))
scene.scaleMode = .AspectFill
Background image has resolution 1536x2048, and so with above scaleMode on iPad it's displayed in its full size, on iPhone 6 1152x2048 is displayed with sides trimmed. Works perfectly fine on all devices, and only one background image is needed. Problem is that if I call for size.width or self.frame.size.width it always returns 1536, even if the actual visible area is e.g. 1152.
How can I set SkSpriteNode's position relative to visible area, so that it'll be for example 50x50 from the corner on every device?
How can I set SkSpriteNode's position relative to visible area, so
that it'll be for example 50x50 from the corner on every device?
The "visible area" is simply the view.
So you can make your positions relative to the view, and not the scene. I actually do this a lot in my game, which is universal and runs on both OS X and iOS.
In my case I typically do this for the user-interface, so I might have a scaled scene but I want to set some positions not relative to the scaled scene but relative to the visible area (i.e. the view).
To do this, you can write a function that converts view coordinates to the corresponding scene coordinates.
Here is my function that I use. Note that I subtract my desired y-position from height of view so that I can treat (0,0) as the bottom-left like sprite-kit does instead of the top-left like UIKit does.
func convert(point: CGPoint)->CGPoint {
return self.view!.convert(CGPoint(x: point.x, y:self.view!.frame.height-point.y), to: self)
}
Here is an example of using this function:
self.node.position = convert(CGPoint(x: 50, y: 50))
This will always force the position of the node to be at (50,50) relative to the view (the visible portion of the screen) regardless of how your scene is scaled and sized.
I don't think this is really the best approach. You should creating the GameScene based on SKView's size
let scene = GameScene(size: self.skView.bounds.size)
I don't think you should be setting one universal size for every device. You need to let the device set the scenes dimensions based on the screen's resolution. Then you need to be creating different images based on the device. 2x, 3x, 2x~ipad etc..
This tutorial is a good place to start:
http://www.raywenderlich.com/49695/sprite-kit-tutorial-making-a-universal-app-part-1
In learning SpriteKit so I'm making a scene with 1 buttons. I do not understand the way positions work. What I read was that 0,0 was the bottom left corner and the default anchor point is in the middle of each button (0.5,0.5). The scene is scene.scaleMode = .AspectFill. If I write:
self.playButton.position = CGPointMake(self.playButton.size.width/2,CGRectGetMidY(self.frame))
self.addChild(self.playButton)
I get what is in the screenshot below.
If I set the playbutton.position.x to be self.playbutton.size.width/2 then I would assume it would be on the left edge of the screen. Not weirdly somewhat off the screen. I've read the documentation about size for a couple of days now and I still can't seem to understand it. I've also explicitly set:
self.size.width = 768
self.size.height = 1024
Meaning the scene size width and height. Also I have "Use Auto Layout" in the main storyboard checked.
If you change your scene's scale mode to .AspectFit you'll be able to quickly see what the problem is. The resolution you're setting for your scene is a completely different aspect ratio from that of your device. In fact, when I answered your last question, I assumed that your usage of the 768x1024 resolution meant that you were developing for an iPad, for which this is the correct resolution.
On an iPhone with a 4 inch screen, you should be setting the scene's size to be 320x568, and 320x480 for 3.5 inch screens. This can however be simplified by adding this line to the creating of your scene in your view controller. It will set the scene's size to the size of the view controller's view.
scene.size = skView.bounds.size