Использование SpriteKit в неигровых приложениях

Макс Грибов Москва, 2016

Что такое SpriteKit?

• высокоуровневый 2D framework для создания игр

• относительно прост в использовании

• позволяет использовать визуальные редакторы для настройки сцен / анимации

• поддерживается всеми платформами Apple: iOS / macOS / tvOS / watchOS

Для чего нам SpriteKit?

Базовые компоненты SpriteKit

SKViewSKScene

SKNode SKNode SKNodeSKTransition

import UIKit import SpriteKit

class OnboardingViewController: UIViewController {

override func viewDidLoad() { super.viewDidLoad() let actionView = SKView() view.addSubview(actionView) let margins = view.layoutMarginsGuide actionView.leadingAnchor.constraint(equalTo: margins.leftAnchor).isActive = true actionView.topAnchor.constraint(equalTo: margins.topAnchor).isActive = true actionView.trailingAnchor.constraint(equalTo: margins.trailingAnchor).isActive = true actionView.bottomAnchor.constraint(equalTo: margins.bottomAnchor).isActive = true let myScene = SKScene(fileNamed: "OnboardingScene") actionView.presentScene(myScene) //... } }

Иерархия объектов в SKScene

SKNode

SKNode

SKNode

SKNode

SKScene

root

UIView

UIView

UIView

UIView

UIView

UIView

root

SKNode

child

Строительные блоки SpriteKit

SKNodeSKSpriteNode

SKEmitterNode

SKShapeNode

SKEffectNode

SKScene

iOS 7

SKFieldNode

SKLightNode

SK3DNode

iOS 8 SKCameraNode

SKAudioNode

SKReferenceNode

iOS 9

SKTileMapNode

SKWarpable

SKWarpGeometry

iOS 10

UIResponder

SKCropNode

SKLabelNode

SKVideoNode

SKSpriteNode

Size

mySprite.color = UIColor.blueColor()mySprite.texture = SKTexture.textureWithImageNamed(“GreenBottle”)

Anchor Point

mySprite.anchorPoint = CGPointMake(0.5, 0.5)

mySprite.size = CGSizeMake(100.0, 100.0)

SKNode

Ссылки на объекты SpriteKitimport SpriteKit

class OnboardingScene: SKScene { var flowerSprite: SKSpriteNode override init() { flowerSprite = SKSpriteNode(imageNamed: "FlowerSpriteImage") super.init() addChild(flowerSprite) } //... }

import SpriteKit

class BetterOnboardingScene: SKScene { override init() { let flowerSprite = SKSpriteNode(imageNamed: "FlowerSpriteImage") flowerSprite.name = "flower" super.init() addChild(flowerSprite) } func moveFlower() { let flower = childNode(withName: "flower") //... } }

Система координат

SKSceneY+

X+

0,0

Y-

X+1,10,1

1,0

0.5,0.5

0,0

myScene.anchorPoint = CGPointMake(0,0)

myScene.anchorPoint = CGPointMake(0,1)

zPosition

-Z

+ZredSprite.zPosition = 0

blueSprite.zPosition = 10

secondBlueSprite.zPosition = 10secondBlueSprite.zPosition = -10

FRONT TOP

SKAction

let flowerSprite = SKSpriteNode(imageNamed: "FlowerSpriteImage") let moveAction = SKAction.moveBy(x: 100.0, y: 0, duration: 1.0) flowerSprite.run(moveAction) flowerSprite.run(SKAction.rotate(byAngle: 45.0, duration: 1.0)) flowerSprite.run(SKAction.scale(by: 1.5, duration: 1.0))

SKAction

let boomTextureAtlas = SKTextureAtlas(named: "BoomTextureAtlas") var boomSpriteTextures = [SKTexture]() for textureName in boomTextureAtlas.textureNames { boomSpriteTextures.append(boomTextureAtlas.textureNamed(textureName)) } let boomSprite = SKSpriteNode(texture: boomSpriteTextures[5]) boomSprite.run(SKAction.animate(with: boomSpriteTextures, timePerFrame: 0.2))

SKAction

let spriteSize = CGSize(width: 100.0, height: 100.0) let blueRectSprite = SKSpriteNode(color: UIColor.blue, size: spriteSize) blueRectSprite.physicsBody = SKPhysicsBody(rectangleOf: spriteSize) gravityScene.addChild(blueRectSprite) gravityScene.physicsWorld.gravity = CGVector(dx: 0.0, dy: -9.8)

G

SKAction

Move Rotate Scale

Aimate With Textures

Move

Aimate With Textures

Rotate Scale

timeSEQUENCE

GRO

UP

let sequenceAction = SKAction.sequence([moveAction, rotateAction, scaleAction]) let groupAction = SKAction.sequence([sequenceAction, animateWithTexturesAction]) let secondGroupAction = SKAction.group([moveAction, SKAction.sequence([rotateAction, scaleAction]), animateWithTexturesAction]) let hugeSequenceAction = SKAction.sequence([groupAction, secondGroupAction]) blueRectSprite.run(hugeSequenceAction)

Ссылки на ресурсы

• Session 502 Introduction to Sprite Kit WWDC 2013

• Session 503 Designing Games with Sprite Kit WWDC 2013

• Session 608 Best Practices for Building SpriteKit Games WWDC 2014

• Session 604 What's New in SpriteKit WWDC 2015

• Session 610 What's New in SpriteKit WWDC 2016

• Apple SpriteKit Programming Guide [Objective C]!