Hello Titanium - First App

Fala galera, tudo bom com vocês.

Bom agora com tudo no jeito para desenvolver vamos criar nosso primeiro projeto.

Para isso vá em File > New > Mobile Project e então você verá uma tela parecida com essa abaixo:

Escolha o template Classic > Default Project para começarmos e então clique em Next e então você visualizará a seguinte tela:

Nessa tela vamos dar um nome para o Projeto, no meu caso irei colocar como myFirstApp no campo de Project Name, na opção de Location podemos usar o default ou escolher um local específico para salvarmos nosso projeto, e então devemos escolher obrigatóriamente um App Id que deve seguir o seguinte template: com.myCompanyName.myApp, a versão do SDK que no meu caso estou utilizando a 3.1.0GA, vale a pena lembrar que podemos ter e usar outras versões do SDK. Agora iremos escolher os targets que nossa aplicação irá ser desenvolvidas, temos as opções de iPad, iPhone (Caso você possua um Apple e tenha configurado) temos também as opções Android, BlackBerry, Mobile Web e Tizen, irei fazer a minha app para iPhone e Android, mas caso você esteja usando Windows, escolha Android e  nesse primeiro momento vamos desabilitar a opção de Clould-enable this application. Se ocorreu tudo bem vocês estarão visualizando a tela de configuração do seu projeto.

É nessa tela que fazemos todas as configurações de um Projeto Titanium, desde targets de min-sdk até configurações de módulos externos. Nesse primeiro momento não irei entrar mais em detalhes desse arquivo, mais pra frente irei escrever um post apenas para tratar algumas configurações desse arquivo.

Vamos abrir o arquivo app.js, esse é o primeiro arquivo a ser executado pelo SDK do Titanium. Então vamos fazer o seguinte, para entendermos como as coisas funcionam, vamos apagar todo o código de dentro dele.

Nossa meta aqui é criar uma tela com os seguintes componentes:

- 1 Window com backgroundColor branco;

- 1 View com backgroundColor preto que servirá de "conteiner" para inserirmos os componentes: TextFiel e Button e essa View será adicionada dentro da Window;

- 1 TextField com backgroundColor branco;

- 1 Button com Title "Clique-me" que terá a função de quando clicado, exibir o conteúdo digitado no TextField em uma caixa de diálogo

Seguindo as informações acima seu código deverá ficar como a imagem abaixo:

Agora pode executar seu app para checar como ficou, para isso clique na "setinha" preta em e escolha o Titanium Android Emular ou Titanium Iphone Simulator (Caso possua MAC e tenha configurado) como a imagem abaixo:

Executando o app você obterá algum desses resultados abaixo:

Você deve estar se perguntando, nossa o layout ficou todo quebrado, os elementos ficaram todos "encavaldos". Isso ocorreu porque não configuramos nenhuma propriedade dos elementos com relação a layoult, tamanho e posicionamento. Agora vou ensinar a vocês como configurar essa propriedades no Titanium. Primeiro vamos alterar a View que criamos e definir o layoult como vertical, significa que todo elemento adicionado a ela será na vertical, ou seja, um embaixo do outro, agora vamos definir a altura(height) como sendo "20%" e a largura(width) como "90%" em relação seu seu pai que no nosso caso é a window, isso faz com que o largura e a altura seja do tamanho necessário para mostrar os elementos contidos dentro dela. Com essas novas configuração o código da sua view ficou dessa forma:

Agora vamos alterar as propriedade de largura(width) para "80%" e top para 10 do TextField, a propriedade top é o valor do afastamento do elemento com o elemento acima dele. Fazendo essas alterações o código do TextField ficou assim:

Vamos alterar também alterar o Button, adicionando o valor 10 na propriedade top, para que ele fique afastado do TexField. fazendo isso seu código ficará assim:

Agora falta a ultima parte que é a ação para o clique do botão. Para isso vamos adicionar um listener para o evento "click", esse listener irá pegar o valor do TextField e mostrar em um Pop-up sendo assim o código fica dessa forma:

Executando o app você deverá visualizar algo desse tipo:

Se conseguiu chegar até aqui Parabéns, você acaba de dar um grande avanço na sua carreira.

Se tiverem alguma duvida, sujestão, reclamação é só colocar aqui nos comentário.

Um abraço a todos e até a próxima.

Hello Titanium - Configuração

Fala galera tudo certo por aí?

No nosso ultimo post expliquei um pouco para que utilizamos o Titanium Mobile e como fazemos a sua instalação.

Se tiverem algum problema ou alguma duvida só comentar no post ok?

Agora vamos ver como configuramos ele para rodar nossos aplicativos para Android, iPhone e iPad.

Bom então vamos ao que interessa:

1º Abra o aplicativo Titanium Studio;

2º Com ele aberto vamos checar se temos alguma atualização tanto na IDE quanto no SDK. Para isso vá em Help>Check for Updates;

3º Agora vamos configurar os SDK Nativos para Android e IOS;

4º Clique em Opens the Studio Dashboard 

5º Agora com a aba Get Started selecionada a página até chegar na parte de Configure Native SDKs como a imagem abaixo:

6º Agora basta clicar nos SDK que precisa configurar e seguir os passos. No meu caso abaixo cliquei em Android SDK.

7º Quando clicar em Em Install or Update Android SDK se atentar nos itens requeridos: 

8º Para configurar o Android SDK no Titanium você deve instalar o Android 2.3.3 (API 10) toda, então selecione como a imagem abaixo e clique em install packages...

9º Para verificar se seu Titanium Studio foi configurado corretamente os SDKs que você decidiu configurar deverão estar verde como a imagem acima e também checar nas Preferences(Titanium Studio > Preferences para quem estiver usando MAC ou Window > Preferences para quem estiver usando Windows). Com a tela de Preferences aberta Abrir a aba Studio > Platforms > Android para checar a configuração do Android ou Studio > Platforms > IOS para checar as configurações do IOS. No meu caso eu configurei os SDKs nativos para Android e IOS. Olhem como ficou minha configuração para o Android e IOS respectivamente:

Android

IOS

Basicamente configurar o Titanium Studio você apenas basta seguir esses passos. Se tiverem algum problema ou alguma duvida comente nesse post que eu responderei.

Para a próxima aula vamos fazer nosso primeiro app cross-platform.

Um abraço a todos e até a próxima.

Hello Titanium - Instalação

Fala galera, tudo certo por aí?

Vou falar um pouco sobre a plataforma de desenvolvimento Titanium Mobile.

Que tal aprender a desenvolver aplicativos para iPhone, iPad e Android?

E o melhor de tudo, precisa apenas saber programar JavaScrip e lógica de programação.

Tudo isso é possível utilizando a plataforma de Titanium mobile.

Bom, então vamos ao que interessa.

1º - Devemos nos Cadastrar gratuitamente no site da Appcelerator;

2º - Baixar o Titanium Studio que é a IDE de desenvolvimento.
       Ps. Se você não possui um Macbook ou iMac você não conseguirá desenvolver aplicativos para a plataforma IOS.

3º Após baixar e instalar o Titanium Studio, vamos abrí-lo;
    - Abra o aplicativo do Titanium Studio, entre com seu usuário e senha;
    - Após se logar no aplicativo você deve estar visualizando algo parece com a imagem abaixo.

Na próxima postagem vamos aprender a configurar o Titanium Studio para desenvolver nosso primeiro aplicativo Cross-Platform com o poderoso Titanium.