Nessa apresentação explico os fundamentos para o desenvolvimento de aplicativos universais de forma simples.

1. DESENVOLVIMENTO DE
APLICATIVOS IOS UNIVERSAIS
André Gustavo Espeiorin
Semana da Informática - Univille

2. APRESENTAÇÃO
• Sócio/Desenvolvedor/Eletrecista na Coderockr
• Desenvolvedor iOS desde 2010
• Instrutor de desenvolvimento iOS
• Ex-graduando em Ciência e Engenharia da Computação
• Fã de coisas legais, como Arduino por exemplo...
• http://about.me/xorna

3. APPS

4. APPS

5. APPS

6. APPS

7. APPS

8. APPS

9. APPS

10. APPS

11. APPS

12. APPS

13. APPS

14. FERRAMENTAS
• Xcode
• iOS Simulator
• Framework Cocoa-Touch

15. XCODE
• IDE nativa da Apple
• Versão Atual: 4.5.1
• Suporta desenvolvimento iOS e OS X
• Interface Builder integrado
•A partir do SDK 5.0 possui suporte a Storyboards
• Documentação integrada off-line

16. XCODE

17. IOS SIMULATOR
• Simula
• iPhone
• iPhone Retina
• iPhone Retina 4”
• iPad
• iPad Retina

18. IOS SIMULATOR

19. COCOA TOUCH
• Framework Foundation
• Framework Base do iOS e OS X
• Classes mais básicas do Sistema
• UIKit
• Interface Gráfica
• Elementos Gráficos, Eventos, Manipulação de toques

20. METAS DA NOITE
• Desenvolvimento de Aplicativo Universal
• Compatível com
• iPhone
• iPhone Retina (3,5” e 4”)
• iPad
• iPad Retina

21. DIFERENÇAS ENTRE TELAS
• iPhone (3,5”, 320x480px, ~165ppi)
• iPhone Retina (3,5”, 640x960px, ~330ppi)
• iPhone 5 (4”, 640x1136px, ~326ppi)
• iPad (9,7”, 768x1024px, ~132ppi)
• iPad Retina (9,7”, 1536x2048px, ~264ppi)
• iPad Mini (7,85”, ~163ppi)???

22. TELAS RETINA DISPLAY
E IMAGENS
• Pixels 4x mais densos
• Resolução duplicada
• Solução Automática
• Imagem no tamanho normal (imagem.png)
• Imagem com tamanho dobrado (imagem@2x.png)
•O próprio sistema cuida da escolha

23. TRATANDO OS DIVERSOS
TAMANHOS DE TELA
• Telas com mesma proporção
• Telas com variação de altura
• Telas com tamanhos diferente

24. MESMA PROPORÇÃO
• iPhone e iPhone com Retina Display
• 320x480 e 640x960
• iPad e iPad com Retina Display
• 768x1024 e 1536x2048
• Apenas dimensionamento de imagens
• Dica: Faça o design já Retina Display

25. VARIAÇÃO DE ALTURA
• iPhone 4/4s e iPhone 5
• 640x960 e 640x1136
• Alteração de altura e espaçamento de elementos visuais
• iOS 5 < (x, y, largura, altura)
• iOS 6 > (Constraints)

26. TAMANHOS DIFERENTES
• Telas do iPhone carregadas no iPad
• Redimensionamento
• Reposicionamento
• Layouts Simples
• Evitar Grandes espaços vazios
• Levar em conta um design diferente para a “View”

27. MÃO NA MASSA
• Desenvolver aplicativo universal
• Lista de produtos
• Tela com detalhes do produto
• Utilizar imagens normais e retina display
• Reutilizar Views e ViewControllers
• Desenvolver View específica para dispositivo

28. IPHONE

29. IPAD (RETRATO)

30. IPAD (PAISAGEM)

31. CRIAÇÃO DO PROJETO

32. CRIAÇÃO DO PROJETO

33. CÓDIGO...

34. DÚVIDAS?
• http://about.me/xorna
• http://twitter.com/xorna
• xorna@coderockr.com
• http://devrockr.wordpress.com
• http://coderockr.com