Introdução ao Sprite Kit

Transcript

1. Introdução ao Sprite Kit #NSNull 2013
2. Guilherme Andrade gui.aandrade@gmail.com @gui_aandrade
4. Mercado de jogos • Grande parte das apps de sucesso na App Store são games • Em uma olhada rápida no ranking de apps mais rentáveis, 44 de 48 apps são jogos • E muitos destes jogos são 2D
5. Como os jogos eram feitos? • Cocos2D iPhone • Cocos2D-X • Unity • Corona
6. Apple e o suporte a jogos • A Apple tem adicionado APIs de jogos desde seus primórdios • Core Animation (para jogos muito básicos) • OpenGL ES • Game Center • GLKit • Para evoluir ainda mais...
7. Sprite Kit
8. As partes de um jogo com Sprite Kit Scenes Actions Physics
9. SKScene Background Personagem 1 Personagem 2 ... Scenes / Nodes Physics Actions Menu Pause ...
10. Exibindo conteúdos em um View Application UIView / NSView SKView [skView presentScene:myScene]
11. Game Loop • Para cada frame do jogo, a sequencia de eventos é disparada - update SKScene executa as ações - didEvaluateActions; SKScene simula a física - didSimulatePhysics; SKView renderiza a cena
12. Demo
13. Sprite Kit Nodes
14. Sprite Kit Nodes SKNode SKLabelNode SKEmitterNode SKShapeNode SKSpriteNode SKScene SKVideoNode SKEffectNode SKCropNode
15. SKNode • É o objeto base para a construção de um jogo • Um “Node” pode possuir outros “Nodes” como filho • Principais propriedades de um “Node” • position • zPosition • xScale • yScale • alpha • hidden • parent • children (Array)
16. SKSpriteNode
17. SKSpriteNode • É o tipo de “Node” mais utilizado em um jogo • Pode ser criado a partir de uma imagem ou cor • E também é possível combinar uma image com uma cor
18. Demo
19. SKEmitterNode
20. • É um completo sistema de partículas 2D • Possui um editor integrado ao Xcode • Inclui um conjunto de exemplos por padrão SKEmitterNode
21. Demo
22. Outros tipos de “nodes”
23. Outros tipos de “nodes” • SKVideoNode • SKShapeNode • SKLabelNode • SKEffectNode • SKCropNode
24. Ações e Animações
25. Ações e Animações • O Sprite Kit adiciona um conjunto de “Actions” para a animações dos “nodes” • É um sistema super simples de ser utilizado • Todas as ações são executadas pela classe SKAction
26. Ações básicas • Rotação • [SKAction rotateByAngle:M_PI duration:1.0]; • [SKAction rotateToAngle:M_PI_2 duration:2.0]; • Translação • [SKAction moveTo:aPoint duration:1.0]; • [SKAction moveToX:200.0 duration:1.0]; • [SKAction moveToY:200.0 duration:1.0];
27. Ações básicas • Fade • [SKAction fadeAlphaBy:0.75 duration:1.0]; • [SKAction fadeInWithDuration:1.0]; • [SKAction fadeOutWithDuration:1.0]; • Escala • [SKAction scaleBy:1.5 duration:1.0]; • [SKAction scaleTo:1.5 duration:1.0];
28. Execução de SKActions • Para executar uma action, é necessário chamar o método “runAction” • É possível criar uma ação e depois executá-la • SKAction *action = [SKAction rotateByAngle:M_PI duration:1.0]; • [sprite runAction:action]; • Ou realizar a chamada in-line • [sprite runAction:[SKAction rotateByAngle:M_PI duration:1.0]];
29. Repetições de ações • Repetindo N vezes uma ação • SKAction *rotate = [SKAction rotateByAngle:M_PI duration:1.0]; • SKAction *rotateThreeTimes = [SKAction repeatAction:rotate count:3]; • Repetindo uma ação para sempre • SKAction *rotate = [SKAction rotateByAngle:M_PI duration:1.0]; • SKAction *rotateForever = [SKAction repeatActionForever:rotate];
30. Ações em sequência • SKAction *action1 = [SKAction moveTo:aPoint duration:1.5]; • SKAction *action2 = [SKAction rotateByAngle:M_PI duration:3.0]; • SKAction *action3 = [SKAction fadeOutWithDuration:0.5]; • SKAction *sequence = [SKAction sequence:@[action1, action2, action3]]; • [sprite runAction:sequence]; Action 1 Action 2 Action 3 1.5 segundos 3.0 segundos 0.5 segundos 5 segundos
31. Ações em grupo • SKAction *action1 = [SKAction moveTo:aPoint duration:1.5]; • SKAction *action2 = [SKAction rotateByAngle:M_PI duration:3.0]; • SKAction *action3 = [SKAction fadeOutWithDuration:0.5]; • SKAction *sequence = [SKAction group:@[action1, action2, action3]]; • [sprite runAction:sequence]; Action 1 Action 2 Action 3 1.5 segundos 3.0 segundos 0.5 segundos 3.0 segundos
32. Outras ações • Ações de tempo • SKAction *wait = [SKAction waitForDuration:2.0]; • Animação de textura • SKAction *textures = [SKAction animateWithTextures:textures timePerFrame:0.1 resize:NO restore:YES]; • Remoção de um node • SKAction *remove = [SKAction removeFromParent]; • Execução de código • SKAction *block = [SKAction runBlock:^{ • // code • }];
33. Demo
34. Simulação de Física
35. Simulação de Física • Sistema completo de física dentro dos objetos do Sprite Kit • Não é necessário incluir dependência externas • Toda a implementação é realizada em Objective-C
36. SKPhysicsBody • Permite adicionar física aos “nodes” • A adição é feita populando a propriedade “physicsBody” de um “node” • Define um conjunto padrão de formatos de objetos
37. SKPhysicsBody [SKPhysicsBody bodyWithRectangleOfSize:size]; [SKPhysicsBody bodyWithPolygonFromPath:path]; [SKPhysicsBody bodyWithCircleOfRadius:radius];
38. SKPhysicsWorld • Cada objecto “Scene” possui um “physicsWorld” • É possível definir a gravidade e a velocidade • Possui um delegate para contato de objetos
39. Demo
40. Dúvidas?