O segundo de uma série de tópicos que visa, com uma linguagem fácil e bem objetiva, servir de guia para quem está começando ou tem interesse no desenvolvimento de apps nativos para iOS. Nesse tópico, o foco é a criação do seu primeiro app: o Hello World.

1. 1Tópico UM
Meu primeiro app para iOS – Tópico UM
Por André Luiz Salla
Quando estamos começando a aprender algo
novo, a primeira coisa que queremos é ver resultados;
ver algo em ação. Aqui não vai ser diferente.
Se esse é o primeiro tópico que você está lendo,
sugiro que comece pelo Tópico ZERO, Desenvolvendo
apps nativos para iOS, para que você possa ter uma ideia
do que lhe espera, e do que você precisa para começar a
desenvolver seus apps.
De início, vou pressupor que o “ambiente de
desenvolvimento” já esteja criado (no nosso caso, é só
ter instalado o XCode no seu OS X).
Nos exemplos e imagens à seguir, serão usados
o XCode 6.2, rodando sobre a versão Yosemite do OS X
(10.10.3).
Mãos à obra!
Quando você abrir o XCode, você verá uma tela
semelhante à da Imagem 2. Essa é a tela inicial do XCode.
Ela exibe os arquivos e projetos recentemente abertos à
direita, assim como algumas opções para abrir ou iniciar
um projeto à esquerda.
Vamos então criar nosso primeiro projeto.
MeuPrimeiroApp
1 - No menu do XCode, vá em "File -> New ->
Project...". (Imagem 1)
“Finalmente vou ver alguma
coisa acontecer! Quero meu
app rodando já!!!”

2. 2 Meu primeiro app para iOS
Imagem 1: Criando um novo projeto
Como é possível ver, vamos nos deparar com
muitos atalhos enquanto estivermos usando o XCode.
Vale a pena tentar memorizar alguns deles, e resistir à
tentação de usar os menus. Com o tempo, o uso desses
atalhos irá se tornar automático, e você irá começar a se
perguntar onde era que você clicava pra exibir ou ocultar
algum assistente.
Para que ninguém se perca, esses são os botões
aos quais os símbolos se referem:
SÍMBOLO TECLA
⌘ Command
⌃ Control
⌥ Option
⇧ Shift
Imagem 3: Templates disponíveis
2 - Após o passo 1, você verá uma tela como
na Imagem 3. Nela selecionaremos o template para o
nosso novo projeto.
Existem vários templates pré-moldados para
aplicações iOS. Na maioria dos exemplos iremos utilizar a
Single View Application. A Single View Application trará
uma única tela pré-criada, onde iniciaremos o
desenvolvimento da nossa aplicação (o que não significa
que o app terá apenas uma tela).
3 - Nesse ponto, iremos colocar o nome do
nosso projeto, assim como algumas informações
adicionais. Após preencher os dados, clique em Next.
Imagem 2: Tela inicial do XCode

3. 3Tópico UM
Imagem 4: Dados do projeto
Product Name: É, literalmente, o nome do
produto; o nome que você pretende dar à sua aplicação.
Organization Name: Por padrão, o
Organization Name vem carregado com o nome do seu
usuário, no entanto esse valor pode ser alterado
conforme sua necessidade. Esse campo é usado para
designar o nome do desenvolvedor ou empresa
responsável pelo app.
Organization Identifier: O organization
identifier é um identificador único para a Empresa, usado
pelo XCode para que se possa formar o Bundle Identifier.
A Apple recomenda, em seu Guia de Distribuição de App
(App Distribution Guide) utilizar uma nomenclatura de
domínio reverso para criar o Organization Identifier. Por
exemplo: se a empresa GeekDotCom resolva
desenvolver um app para iOS usando o XCode. Seu
Organization Identifier poderia ser
“br.com.geekdotcom”.
Bundle Identifier: Por padrão, o Bundle
Identifier é composto pelo Organization Identifier +
Product Name, e não pode ser alterado no momento da
criação do projeto (é possível alterá-lo mais tarde). É
muito importante que o Bundle Id seja único para sua
aplicação, pois ele será utilizado para identificar
unicamente sua aplicação. Por exemplo: recursos como
o In-App Purchase (serviço que permite realizar
“compras” dentro do seu aplicativo, como filtros para
apps de edição de fotos) utilizará o Bundle Id para
identificar a sua aplicação.
Language: É possível escolher qual a linguagem
padrão que será utilizada no desenvolvimento da sua
aplicação. Nesse exemplo em específico, pouco importa
a linguagem, pois não entraremos em detalhes sobre
linguagem (e nenhum código será escrito). As duas
opções de linguagem, como citadas no tópico ZERO, são
Objective-C e Swift.
Devices: Os dispositivos para o qual você está
desenvolvendo (seu target). Você pode escolher como
target iPads ou iPhones. Ainda há opção Universal, que
compreende tanto iPad quanto iPhones.
Use Core Data: O Core Data é uma biblioteca
para persistência de dados no iOS, que facilita a
manipulação de entidades dentro da aplicação. Como
não iremos persistir dados nessa aplicação, não temos
necessidade de utilizar as bibliotecas do Core Data. Se
mantivéssemos marcada essa opção, o XCode importaria
o Core Data para nossa aplicação, e criaria os métodos
necessários para sua utilização na classe AppDelegate,
assim como criaria também um arquivo de Data Model,
onde poderíamos mapear nossas entidades e seus
relacionamentos (falarei mais especificamente do Core
Data em tópicos futuros).
4 – Selecione o local onde o diretório do seu
projeto será criado. Após, clique em Create para criar seu
projeto. (Imagem 5)
Imagem 5: Destino do projeto
Apesar de não ser o momento para se
aprofundar em detalhes como controle de versão, vale a
pena ressaltar aquele checkbox logo acima dos botões.
Por padrão, o checkbox de Source Control vem
selecionado para todo novo projeto. Quem já trabalha ou
trabalhou com Git e Controle de Versão já conhece as
funcionalidades desses recursos. Não vou entrar em
detalhes agora sobre o que é ou como funciona o Source
Control, ou mesmo um Git Repository. Por hora, basta
para nós sabermos que o XCode possui uma boa
integração com recursos de controle de versão, e que,

4. 4 Meu primeiro app para iOS
mesmo se desmarcado, é possível adicionar o controle
de versão posteriormente ao seu projeto.
5 – Após criado, essa será a cara inicial do seu
projeto. (Imagem 6)
LEGENDA
1 Barra de Navigators
2 Barra de Utilities
A Alterna para Standard Editor
B Alterna para Assistant Editor
C
Alterna para Version Editor (usado para
controle de versão)
D Exibe/Esconde os Navigators
E Exibe/Esconde o Debug Area
F Exibe/Esconde os Utilities
Utilizar as teclas de atalho fazem nosso
trabalho muito mais rápido. Abaixo, vou citar alguns dos
principais atalhos que você utilizará nesse tópico.
COMANDO TECLAS DESCRIÇÃO
Assitant
Editor
⌥⌘⏎
Alterna para o modo
Assistant Editor, com
função semelhante ao
botão B.
Exibir
Navigator
⌘0
Exibe/Esconde a barra de
Navigators (1), com
função semelhante ao
botão D.
Exibir
Utilities
⌥⌘0
Exibe/Esconde a barra de
Utilities (2), com função
semelhante ao botão F.
Standart
Editor
⌘⏎
Alterna para o modo
Standart Editor, com
função semelhante ao
botão A.
Exibir ou esconder algumas das barras laterais
vai do gosto do desenvolvedor. Se você tem um Mac com
tela pequena, ou está trabalhando com telas ou
storyboards grandes (vou falar especificamente sobre
storybards em um tópico futuro), eu sugiro que você as
oculte, para facilitar seu trabalho.
Imagem 6: Tela inicial do projeto

5. 5Tópico UM
6 – Vamos então iniciar! Abra o arquivo
Main.storyboard no Project Navigator (primeira página
na área de Navigator).
Imagem 7: Main.storyboard
Ao abrir o Main.storyboard, você encontrará
sua primeira “tela” já criada, em branco. Quando você
abrir um arquivo de storyboard ou xib (um outro modo
de criar interface gráficas, precursor dos storyboards),
quem entra em ação é o Interface Builder (Imagem 8). É
ele que permite que você edite visualmente suas UI
(interface de usuário).
No Interface Builder, você pode utilizar o zoom
para visualizar melhor sua tela (por enquanto falaremos
de telas, mas não estranhe ler em tutoriais pela internet
o termo scene, que explicarei em um tópico específico de
storyboards). No entanto, você não pode editá-la
enquanto estiver no modo em escala. Para que as opções
de edição drag-and-drop estejam habilitadas, por
exemplo, é necessário que o zoom esteja em 100%.
7 – Selecione o objeto Label na página de
Objetos (terceira página da Library bar, encontrada na
metade de baixo da Utilities Area) e arraste-o para o
meio da tela da sua aplicação (Imagem 9). Você pode
utilizar as guias azuis que irão aparecer na sua tela para
ajudá-lo a centralizar seu objeto.
Imagem 9: Arrastando objetos da Library Bar
Imagem 8: Interface Builder

6. 6 Meu primeiro app para iOS
8 – Após posicionar a Label na tela, selecione
o objeto e abra o Attributes Inspector (quarta página na
metade de cima da Utilities Area). Altere o atributo Text
para “Hello World”, conforme a Imagem 10.
Imagem 10: Attributes Inspector
9 – Faça os ajustes necessários para que o
texto da sua Label apareça todo na tela, sem as
reticências no final. (Imagem 11)
Imagem 11: Ajustando Label
10 – Após ajustar a Label, vamos rodar nossa
aplicação! Na barra superior, selecione o destino da sua
aplicação, onde ela irá rodar. Na Imagem 12, o destino
selecionado é o iPhone 6, rodando pelo iOS Simulator.
Após selecionado o destino, pressione o botão Run
(botão parecido com um play).
Imagem 13: Rode sua aplicação
Sobre o iOS Simulator
O iOS Simulator é uma poderosa ferramenta
que permite ao desenvolvedor simular o dispositivo real
da Apple (iPhone ou iPad), emulando seu sistema
operacional, o iOS.
Nem todos os recursos do sistema operacional
estão disponíveis no Simulator (como Push
Notifications), mas ainda assim ele é uma mão na roda
para o desenvolvedor.
Uma dica que eu dou é que você altere a escala
(zoom) do seu Simulator caso você tenha um Mac com
tela pequena ou baixa resolução (acredite, algumas
pessoas penam bastante até descobrirem que existe essa
possibilidade).
Não vou entrar em maiores detalhes sobre o
Simulator nesse momento. Quando eu falar sobre algum
recurso específico do Simulator, explicarei
detalhadamente sua função (como geo localização, por
exemplo).
11 – Sua primeira aplicação está finalmente
rodando!! (Imagem 13)
Imagem 12: Aplicação rodando no iOS Simulator

7. 7Tópico UM
É, nosso Hello World ficou torto... mas por que isso?
Quando adicionamos nosso Label à tela, ele foi
posicionado de modo absoluto, ou seja, com uma
posição fixa horizontal e vertical. No entanto, como
estamos lidando com uma aplicação que pode rodar em
dispositivos de diversos tamanhos (o iPhone 5, 5c e 5s
têm telas de 4”, enquanto o 6 tem tela de 4,7” e o 6 Plus
de 5,5”), o que você posicionar na tela no storyboard
pode não corresponder à realidade do dispositivo
escolhido.
Como eu posso “prever” isso?
O XCode conta com um recurso muito
interessante para ajudar no desenvolvimento de UI: o
Preview. Com o Preview, é possível pré-visualizar sua tela
para diferentes dispositivos, versões do iOS e inclusive
“Localizações” (Locations, que permitem a
internacionalização do seu app).
O Preview é acessível pelo Assistant Editor,
conforme é possível ver na Imagem 14.
Imagem 14: Acessando o Preview
No Preview, é possível adicionar novos
dispositivos para pré-visualização, clicando sobre o sinal
de soma ( + ) no canto inferior esquerdo do Preview, e
selecionando à configuração desejada. (Imagem 15)
Imagem 15: Adicionando novas configurações ao Preview
Vou precisar puxar o Label na mão e centralizar na tela?
Preciso fazer isso via código???
Não, o iOS conta com um recurso que facilita (e
muito) a vida dos desenvolvedores, quando a questão é
posicionamento de objetos: as Constraints.
Por hora, não se preocupe com o conceito e
nem em como funciona as Constraints no iOS. Eu
explicarei isso detalhadamente quando falarmos de
Relative Layout e Size Classes, em futuros tópicos. Tudo
à seu tempo!
12 – Selecione sua Label, segure Control e
clique e arraste sua Label para o interior da sua tela. Ao
soltar, o popup semelhante à Imagem 16 aparecerá,
indicando a relação entre os dois objetos. Selecione as
opções conforme abaixo, para centralizar sua Label
horizontalmente e verticalmente.
Imagem 16: Centralizando a Label
13 – Rode novamente sua aplicação e veja o
resultado!
That is all, folks!
Esse foi o primeiro tópico “mão na massa”
dessa série de tópicos. Nosso primeiro aplicativo está
rodando e já estamos livres da maldição do Hello
World!!! Agora é com você! Melhore essa aplicação.
Explore os demais objetos. Investigar é sempre uma
forma de se aprender coisas novas.
Nos próximos tópicos, vamos continuar nossa
incursão no mundo do iOS. Quem sabe na próxima eu
não deixo vocês escreverem um pouco de código...
(hehehe)
Até a próxima!
“Epa, tá torto”