Adding a SKSpriteNode to UIView - ios

I'm stuck on something, maybe someone can help me.
I'm working on a iOS swift game (I'm a beginner iOS developer).
In the StoryBoard I've added some buttons, some views, etc.
I've added a reference (of a rectangle) in my controller like (using ctrl+drag):
#IBOutlet weak var mainBoardGame: UIView!
In my GameScene I'm creating some SKSpriteNodes like:
playerSprite = SKSpriteNode(imageNamed: "playerImg")
playerSprite.position = ....
playerSprite.size = CGSize(width:...,height: ...)
self.addChild(playerSprite)
My problem is that this SKSpriteNodes are displayed behind the rectangle (mainBoardGame) created in my storyboard.
I've tried to add something like
playerSprite.zPosition = 100
but still the same.
I'm thinking that it would be better to add my playerSprite directly to my mainBoardGame (because it will be displayed inside of it) but I don't know how to handle a UIView and a SKSpriteNodes.
How can we add a SKSpriteNodes to a UIView ?
How to handle the z order between them ?
The main question is how to handle a UIView and a SKSpriteNode ?
Thanks.
The reason why I've build it in the storyboard is because I put some contraints in order to have a well displayed elements on each of the iPhone screen size.
Is there a way to do that in SpriteKit ?
C.C.

SpriteKit does not play nicely with subviews. SKScene wants to occupy a view entirely, so the high-performance 2D game engine can work its magic.
Why not just create your game board within your scene, and have the enclosing view occupy constraints? It's harder to provide a more specific answer without more detailed code examples.

Related

Using UICollectionView in an SKScene to implement horizontal scrolling menu

I am implementing a horizontal carousel-style character selection screen for a game (as per image below).
Image of carousel effect
The app is structured as one main GameViewController presenting different scenes; the CharacterSelectionScene being one of them.
From my research it seems that, although not always advisable to mix UIKit and SpriteKit elements, the best way to achieve the effect is the use a UIColectionView and add it as a subview to the scene. Because it takes care of the some of the animation and bounce effects.
Horizontal scrolling in SpriteKit (vs. a viewcontroller)
However, it's giving me a real headache! Using the post above as an example, I subclassed UICollectionView but I am unable to use the CharacterSelectionScene as the datasource and delegate! This would be ideal as the scene is where the data is loaded in from a plist.
I am currently using my CharacterCollectionView as the datasource and delegate by passing data from the scene via the collection view's init() a la:
collectionView = CharacterCollectionView(frame: customFrame, collectionViewLayout: layout, characterData: characterData)
This works but feels like a bad idea, it feels like a bit of a bodge. Maybe I'm wrong but as a fairly new programmer I'd just like to do this the right way!
Can anyone point me in the right direction? Am I going down completely the wrong path here or is this a perfectly good way to move forward. All advise/pointers appreciated!

CALayer is not positioned correctly within the View

Context
I am using this simple library to make an intro/walkthrough for my app (TL;DR, horizontal paging view controllers). I currently have 3 pages setup.
In the 3rd walkthrough page, I have a custom CALayer that animates a circle in an endless loop. I'd like to add that layer to a UIView in order to lay it out the way I want in IB (via auto layout).
In viewDidLoad (for the 3rd page) I create the circle layer and set its frame to be the same as the view I positioned, assuming the circle would be in the same spot as the view:
for v:UIView in [view1!, view2!] {
var pulse = PulseLayer()
pulse.frame = v.frame
pulse.cornerRadius = v.frame.width / 2.0
pulse.masksToBounds = false
view.layer.insertSublayer(pulse, above: v.layer)
}
Problem
When I run the app in the iPhone 6 simulator, the CALayers show up OUTSIDE their UIViews (see below).
One thing I noticed immediately is the layers are not misplaced the same way--one is above its view, and the other is to the left. I am assuming this is related to the constraints on the views, but I cannot figure out how to fix it.
Equally baffling to me is that when run on the iPhone 5 simulator, the layers appear exactly as I expect them to (see below).
I feel like I am misunderstanding some of the concepts at work here. How can I get the positioning to act the same? (Like the iPhone5 gif.)
Or, is there a better way to do what I am trying to do?
viewDidLoad is too soon. Remember, viewDidLoad is way early; the view is not in the interface yet and nothing has its ultimate size/position. If you're going to add the layers to view rather than as sublayers of the little views, you will have to run your layer-creation code much later, in order to get the position right. viewDidAppear: or viewDidLayoutSubviews will be safe - but of course you must use a bool flag so you don't do it too many times.
Personally I don't see why you don't add the layers to the little views. So you would just set pulse.frame = v.bounds and add as a sublayer to v, not to your view. It solves the positioning and gets the relationships right. And doing it in viewDidLoad would work, because when the views move, the layers move with them.

using SKScene or SKShapeNode for a game world

I'm following this question's advice on how to create my game world for a scroller game with camera centered on the player. However, the advice says to use an SKShapeNode; I don't know how I feel about that.
Are there any advantages/disadvantages to using either a shape node or an skscene (or another type of object/node)? Is there a node that is considered best practice to use as a world?
Also, is it possible to create an skscene inside an skscene, or is that bad practice/discouraged?
Thank you!
You can't put a scene inside a scene per-say but you could stagger view controllers and place a view controller on top of another and then put the scene on top of that inset view controller.
The way I implement my scroller games is to put the player in the center and then move the background around. (Checking for bounds of course.)
As far as your advantages/disadvantages I'm not sure what you mean by the SKNodes; that's how you should do it if you're working just in SpriteKit. But don't add another SKScene unless you have something that you can't implement in just one SKScene.

Sprite Kit Table View

I'm trying to build a scrolling table of game center scores in an SKScene. Is there a way to use sprite kit and storyboards/xibs? [self addChild:customTable] on an SKScene doesn't seem to work.
UIKit elements like UITableView, UIView, etc cannot be used as children of SpriteKit nodes. You can place a UITableView on top of a SKView/UIView but that comes out as crude. I would suggest you use a normal UIViewController to display your Game Center scores.
However, if you still need to display the scores using SpriteKit, there is a component called ScrollNode which might do the trick. You can find it here.

Cocos2D for First Game - Advice for Beginner

I never developed in Cocos2D. However, this animated app is not easy to make with regular UIView animation and CAAnimation.
I want a number of UIImageView's (from 1 to 30) to float around the screen with the certain path and I want them to be responsive for touch (they would do some animation when touched). I also need them to go back and forth the screen (new path would be calculated) when they are touched or reach the edge of screen. It's important to retrieve X and Y position of each element whenever needed.
Question is: what Cocos2D classes are best looking at (for a beginner) to make that happen? I've tried UIView animation and CAAnimation but I came across some difficulties so I have a feeling Cocos2D may bring better results. Thank you.
Yes, cocos2d makes it much easier. You want to create a CCSprite with the initWithFile: method. Example:
CCSprite *mySprite = [CCSprite initWithFile:#"fire.png"];
[self addChild:mySprite];
Where fire.png has been added to the project and self is the scene instance.

Resources