quarta-feira, 20 de novembro de 2013

Iniciando com o Xcode

Antes de fazer o link entre os componentes da View com o Controller, achei importante mostrar alguns prints do Xcode, que é a IDE de desenvolvimento disponibilidade pela Apple. É free e pode ser baixada na App Store. Um pouco grande para os padrões de tamanho dos programas OSX, mas vale a pena usar.


Ao entrar no Xcode, a primeira coisa que nos deparamos é uma tela para saber que tipo de projeto estamos querendo criar. Existem vários tipos predefinidos e para quem está aprendendo, o projeto mais comum é o Single View.


Depois de escolher o tipo de projeto temos que definir alguns elementos. O mais importante é o nome do projeto e para qual tipo de dispositivo será feito o app. A figura abaixo mostra a tela de definição dos parâmetros do projeto.




Ao criar um projeto do tipo Single View, o Xcode já disponibiliza uma view e um controller para que a gente possa começar a usar. A figura abaixo mostra o elemento view (chamado de Storyboard) e as classes criadas que servirão de controller. O objective-C que é a linguagem de desenvolvimento do iOS segue a mesma linha do C, que contém uma linha para definição (header) e outra para a implementação.



Ao abrir o storyboard, teremos uma visão como a figura abaixo. Note que a view tem a visão da tela do iPhone (poderia ser do iPad caso o projeto fosse para este dispositivo) e é neste espaço que iremos colocar os componentes visuais, como labels, botões, imagens, entre outros. Na parte da direita temos o espaço para visualizar as propriedades dos componentes (parte superior) e os componentes propriamente ditos (parte inferior).



A classe do controller já vem com alguns elementos, como podemos ver na figura abaixo. Na direita temos o arquivo .h e na direta temos o arquivo .m. Veja que já temos dois métodos definidos: o viewDidLoad e o didReceiveMemoryWarning.


Voltando para a view... O Xcode, como a maioria das boas IDEs permite arrastar os componentes para distribui-los dentro da view da forma que desejar. Existem linhas guias que ajudam na disposição dos elementos, facilitando tamanhos, posições de um ou mais componentes.



Para cada componentes podemos definir suas propriedades em tempo de compilação, como pode ser visto na figura abaixo. Ao clicar no componente label, podemos definir, por exemplo, alinhamento, tamanho da fonte, cor do texto, entre várias outras propriedades. Veja que, até o momento, não tem nada muito diferentes de outros ambientes de programação.




Alguns componentes, como os botões, também definem eventos que podem ser disparados.



Nada demais... Muito fácil para quem já conhece outras IDEs. No próximo post vamos fazer o link entre os componentes definidor no Storyboard e a classe controller.

Até a próxima!





Nenhum comentário:

Postar um comentário