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