Back-End

23 out, 2012

Apresentando o Appcelerator Titanium Mobile

Publicidade

O Appcelerator Titanium Mobile é um framework open source para desenvolvimento de aplicações mobile nativas. Os apps são escritos em JavaScript, utilizando a API do Titanium. O código JavaScript é compilado e empacotado através de ferramentas nativas de cada plataforma, gerando código nativo Objective-C, através do XCode e IOS SDK ou Java, pelo Android SDK, para iOS e Android respectivamente.

O Appcelerator Titanium mobile está disponível para Mac, Window ou Linux. Considerando que você querira desenvolver uma aplicação para iOS (iPhone ou iPad), é necessário um Mac com iOS SDK e XCode instaldo. Ppara Android, todas as plataformas acima citadas estão abilitadas, sendo necessário o Android SDK instalado e o ADT (Android Development Tools) para Eclipse.

Nesse artigo vamos fazer uma apresentação dessa plataforma de desenvolvimento e uma amostragem do seu potencial.

Para instalar e configurar o Appcelerator Titanium Studio, vá ao site deles e faça o download do Titanium Studio, apés preencher um pequeno cadastro. Após a instalação, faça o login com os dados cadastrados e aguarde a atualização dos SDK.

Vamos ao primeiro contato com o Titanium!

Clique no menu File | New | Titanium mobile Project e selecione Single Window Appication.

Informe o nome do projeto e os dados do projeto (Project Setting):

Neste caso, dei o nome do projeto de APP01, app id de com.amaxnet.app01, Titanium SDK Version 2.1.1 e Deployment Targets para iPhone e Android.

Clique em Finish para criação do projeto. Com o projeto criado, vamos à sua estrutura. Neste ponto, foi criado uma estrutura de pasta padrão para APP iOS e Android. Atente por o arquivo app.js na pasta Resources – é o arquivo inicial da aplicação Titanium.

Abra o arquivo app.js, apague todo conteúdo, e vamos dar início a primeira aplicação Titanium para iOS e Android. Segue o código:

//CRIA A JANELA MAIN
//neste ponto, foi criado uma variável main, atribuido com o uso da API do Titanium – Titanim.UI, o metodo createWindow, aplicando as propriedades, basicamente como em JQuery.
var main = Titanium.UI.createWindow({
width: 320,
height: 480,
top: 0,
left: 0,
backgroundColor: '#F00',
title: 'APP 01',
barColor: '0000FF'
});

//CRIA A VIEW
//Criamos uma variável chamada view, utilizando o metodo createView da API do Titanium
var view = Titanium.UI.createView({
width: 300,
height: main.height - 40,
left: 10,
top: 10,
backgroundColor: '#fff',
borderRadius: 5
});

//CRIA LABEL 01
//Criamos uma variável Chamada label1, utilizando o metodo createLabel da API do Titanium
var label1 = Titanium.UI.createLabel({

font: {fontSize: 14, fontFamily: 'Helvetica',
fontWeight:'bold'},
text: 'texto 01:'
});

//Após a criação das variáveis, instanciamos cada uma delas.
//Adicionamos a label na view
view.add(label1);
//Adicionamos a view a janela
main.add(view);
//Abrimos a janela
main.open();

Em http://docs.appcelerator.com/titanium/2.1/index.html#!/api, temos a documentação de todos os elementos da API do Titanium.

Vamos executar o código, clicando no menu Run | Run (Command + Shift + F11). Na primeira execução, será solicitado a escolha do emulador.

Vou selecionar iPhone Simulator, e temos o iOS SDK executando o nosso app.

Agora, vamos mudar a execução para Android. Na aba lateral esquerda, Project Explorer, selecione Android Emulator:

Executando novamente, temos noss o app em Android.

Neste artigo, apresentei o Appcelerator Titanium Mobile, um framework para desenvolvimento mobile nativos. Nos próximos artigos, vou explicar melhor a API do Titanium, em aplicações praticas.