How to simulate a world that is larger than the screen in SpriteKit?
I am looking for a suitable SpriteKit way to handle something of a scrollable world. Consider the following image:
In this contrived example, the world border is a dashed line, and the blue dot can move anywhere along those borders. However, at any point, a part of this world can exist off-screen, as shown in the image. I would like to know how I can move the blue dot around the "world" while keeping the camera stationary on the blue dot.
source to share
Good answer to this question, which I cannot find at the moment. The basic idea is this:
- Add a "world" node to your scene. You can give it a width / height that is larger than the screen size.
- When you move the symbol around (or the blue dot), you are actually moving your world node, but in the opposite direction, and it gives the impression that you are moving.
Thus, the screen is always in the center of the blue dot, but the world around you is moving.
below is an example of when I experimented a while ago:
override func didMoveToView(view: SKView) {
self.anchorPoint = CGPointMake(0.5, 0.5)
//self.size = CGSizeMake(600, 600)
// Add world
world = SKShapeNode(rectOfSize: CGSize(width: 500, height: 500))
world.fillColor = SKColor.whiteColor()
world.position = CGPoint(x: size.width * 0.5, y: size.height * 0.5)
world.physicsBody?.usesPreciseCollisionDetection = true
self.addChild(world)
}
override func update(currentTime: CFTimeInterval) {
world.position.x = -player.position.x
world.position.y = -player.position.y
}
source to share
override func didSimulatePhysics() {
self.centerOnNode(self.camera)
}
func centerOnNode(node: SKNode) {
if let parent = node.parent {
let nodePositionInScene: CGPoint = node.scene!.convertPoint(node.position, fromNode: parent)
parent.position = CGPoint(
x: parent.position.x - nodePositionInScene.x,
y: parent.position.y - nodePositionInScene.y)
}}
If you create a "camera" node that you add to your "world" node, a few simple functions (above) allow you to "follow" that camera node as it travels around the world, even though you are actually moving a world like answer by Abdul Ahmad.
This method enables SpriteKit functionality on the camera. You can apply physics to it, launch actions on it, impose restrictions on it, enable effects such as:
- camera shake (action)
- collision (physical body or matching the position of another node with a physical body),
- lag (put a constraint on the camera that keeps it some distance from the character, for example)
The limitation especially adds a nice touch to the moving world, as it allows the "main character" to move freely, only moving the world when he is close to the edges of the screen.
source to share