ISSN 2316-2872

T.I.S. São Carlos, v. 4, n. 1, p. 78-87, jan-abr 2015

©Tecnologias, Infraestrutura e Software

Aplicativos Android: desenvolvimento nativo x uso de

ferramentas baseadas em padrões web
Marcos Roberto da Fonseca, Delano Medeiros Beder
Resumo: Este artigo tem o propósito de orientar o leitor que possui interesse em criar uma aplicação Android a se decidir entre desenvolver
nativamente ou optar pelo desenvolvimento utilizando tecnologia já conhecidas do desenvolvimento web. O presente artigo aponta quais os
benefícios e os malefícios ao escolher uma das formas, levando o leitor a uma conclusão baseada em análises sobre qual forma de
desenvolvimento utilizar.

Palavras-Chave: aplicação Android, ferramenta para aplicações Android, desenvolvimento nativo

Android Application: native development x tools based in web patterns
Abstract: This article intends to guide the reader that is interested in creating an Android application to decide whether to develop natively or
to develop using the web development technologies already known. This article points out the benefits and harms of choosing one of these
development approaches, leading the reader to a conclusion based on analysis on which approaches to use.

Keywords: Android application, tools for Android applications, native development

1. INTRODUÇÃO um lado a maior popularização significa maior mercado para

Vivemos em tempos que graças aos smartphones, é cada
vez maior o número de pessoas que possuem acesso aos
inúmeros recursos da internet. Torna-se cada dia mais comum
o uso desses dispositivos em tarefas corriqueiras como a
somatória de calorias ingeridas, controle de consumo de
combustível nos veículos, pagamento de um boleto bancário,
ligações, envio de mensagens instantâneas, capturas de
imagens, vídeos e até a previsão do tempo. Os smartphones
ganharam mais poder computacional. É provável que esta
seja a maior conquista desta geração (STARK; JEPSON,
2012).
Para quem desenvolve aplicativos, existe a liberdade para
criar de maneira independente aplicativos diversos que
podem ser comercializados ou não aos proprietários de
dispositivos móveis. Há exemplos de aplicativos cujo número
de usuários é na casa de milhões, podendo gerar alto
montante financeiro ao desenvolvedor. Para quem usa os
aplicativos, beneficia-se na quantidade, qualidade e
diversidade de aplicativos criados para inúmeras finalidades
imagináveis. Trata-se de um mercado cada vez mais
competitivo e lucrativo onde desenvolvedor e usuários saem
ganhando.
E é neste aquecido mercado que o sistema Android tem
espaço bastante notável e vários fabricantes acompanharam
esse número de usuários elevado, criando dispositivos que
surgem com diferentes tamanhos e diferentes formatos. Aos
olhos dos desenvolvedores isso é um grande problema. De
atuar. Por outro lado, maior é a fragmentação de dispositivos
que leva o desenvolvimento a se tornar mais complexo,
encarecendo-o e em muitas vezes tornando o projeto inviável,
fazendo com que o mesmo possa nem sair do papel. Seguindo
esta mesma visão, o desenvolvedor deve considerar o número
de pessoas que deseja atingir com o aplicativo a ser
desenvolvido, pois há também diversas plataformas de
mobilidade. Além do Android, que detém a maior população
de usuários (STARK; JEPSON, 2012), há também, entre
outras o IOS e Windows Phone. Isso poderá fazer com que o
desenvolvedor tenha que manter o mesmo aplicativo escrito
em linguagens de programação diferentes, o que dificulta em
certos casos a manutenção desse aplicativo. Porém para se
atingir plataforma diferente, o desenvolvedor em alguns
casos, deverá fazer investimento financeiro para aquisição de
equipamentos para testes reais, além de computadores,
contribuindo para que o aplicativo custe mais tempo de
desenvolvimento além de consumir maior quantidade de
recursos financeiros (STARK; JEPSON, 2012).
Foi pensando nessa situação que frameworks como o
PhoneGap aparecem no mercado de desenvolvimento,
auxiliando na resolução de situações onde os desenvolvedores
precisam encarar um enorme desafio: de criar uma versão da
aplicação de maneira tecnicamente e economicamente viável
e de tal maneira que atinja o maior número de usuários
(STARK; JEPSON, 2012).
Tecnologias como o HTML5 proporcionam um ambiente

Departamento de Computação - Universidade Federal de São Carlos (UFSCar)

Caixa Postal 676 – 13.565-905 – São Carlos – SP – Brasil
Autor para correspondência: marcosfonceka@gmail.com, delano@dc.ufscar.br
Aplicativos Android: desenvolvimento nativo x uso de ferramentas baseadas em padrões web
de criação de aplicativos usando tecnologias web onde vários
desenvolvedores podem criar aplicativos em escala global.
Porém não é todo aplicativo que pode ser escrito usando
tecnologias web, mas seu uso oferece maior flexibilidade e
alcance com menor custo. E é esta a proposta do presente
artigo. Demonstrar de forma didática a estrutura de um
aplicativo nativo Android e demais particularidades, e como
criar um usando tecnologias e padrões web (HTML, CSS e
JavaScript), tornando este segundo, nativo, dando um norte
inicial ao desenvolvedor.
II. APLICATIVOS NATIVOS ANDROID
Segundo (STARK; JEPSON, 2012), são considerados
aplicativos nativos aqueles que devem ser instalados no
dispositivo para que sejam enfim utilizados. Devem ser
obtidos por meio de URL (Uniform Resource Locator)
fornecida pelos criadores ou por meio da loja de aplicativos
oficial dos dispositivos. Aplicativos nativos têm acesso ao
hardware do dispositivo que o executa, como som, câmera e
diversos sensores que o equipam.
Para se ter uma noção, no ano de 2009, segundo
(ROGERS; LOMBARDO; MEDNIEKS; MEIKE, 2009) o
Android poderia ser uma oportunidade aos criadores de
aplicativos e ainda que este também teria potencial para
quebrar barreiras na criação de software para dispositivos
móveis.
Dois anos antes, em 2007, havia mais de 70 milhões de
smartphones vendidos, segundo (ROGERS; LOMBARDO;
MEDNIEKS; MEIKE, 2009) cada um deles com sua marca e
ambiente de execução diferente. E isso dificultava muito o
desenvolvimento, até então nativo, que deveria ser criado uma
versão do mesmo aplicativo para diferentes plataformas se o
aplicativo em questão fosse criado com o objetivo de atingir
amplo número de usuários, o que certamente encarecia-o
muito no sentido custo e tempo.
Com isso surgiu o Android que segundo (ROGERS;
LOMBARDO; MEDNIEKS; MEIKE, 2009) ofereceu aos
desenvolvedores um ambiente de programação estável onde
era possível criar aplicações criativas e distribuí-las as
centenas de milhares de usuários que já existiam por meio de
um catálogo aberto de aplicações onde se permitia – mediante
um cadastro simples e prévio – baixar aplicações pela internet
ou até mesmo distribuí-las por meio de conexão USB.
Todo bom desenvolvedor de aplicativos móveis Android
sabe que ele é poderoso em recursos e recheado de
componentes que visam agilizar e dinamizar a produção
nativa de um aplicativo. Segundo (ROGERS; LOMBARDO;
MEDNIEKS; MEIKE, 2009) atualmente em uma página web
você pode facilmente integrar um mapa com algumas linhas
de código JavaScript, além de muitas outras funções. Esta
integração entre aplicações, além de facilitar, enriquece o
mundo de desenvolvimento web. O Android incorporou este
mesmo conceito. Nele, desenvolvedores podem incorporar
funcionalidades de outras aplicações. Para efeito de exemplo,
você pode usar um mecanismo no Android que lhe permita a
partir de sua aplicação enviar e-mail por meio de qualquer
aplicação especifica para esta finalidade. É dever do sistema
79
operacional Android saber qual aplicação tem esta
responsabilidade e faz com que sua aplicação envie e-mails.
Nas seções que seguem, serão apresentados os quatro tipos
básicos de componentes definidos na arquitetura Android.
A) Atividades
É um componente da aplicação android, que basicamente
fornece uma tela para interação com o usuário, composta por
linhas de código executável que podem ser instanciadas por
meio de uma ação na aplicação ou pelo próprio sistema
operacional Android (ROGERS; LOMBARDO; MEDNIEKS;
MEIKE, 2009). As atividades quando não ativas podem ser
eliminadas pelo sistema operacional, por motivos de
otimização de uso de recursos. As atividades são associadas às
telas de uma aplicação. Segundo (LECHETA, 2010) cada tela
da aplicação haverá uma classe filha de Activity. A mesma
também pode ser comparada com classes JFrame do Swing
em Java. Ainda segundo (LECHETA, 2010) uma tela em
Android é composta por vários elementos visuais
representados por meio de uma classe chamada View.
Elementos visuais são criados por meio de arquivos XML que
os definem dentro de uma tela. A atividade define a existência
de uma tela e a controla. Todas as atividades de uma aplicação
móvel Android são protegidas por meio de um ciclo
controlado de vida, que segundo (LECHETA, 2010) a
acompanha desde sua criação até o término de sua execução.
Seguem os passos do ciclo de vida de uma atividade:
• onCreate – Normalmente são criadas as
visões (telas) da aplicação, momento bom para a
abertura de conexão com banco de dados;
• onStart – Chamado antes da atividade ficar
visível na tela;
• onResume – Momento em que a atividade
está em plena execução recebendo e reagindo a ações
do usuário com a aplicação;
• onPause – Momento em que a atividade
deixa de ter acesso à tela, é a hora de interromper tudo
que consome CPU e claro, bateria. É a chance que a
estrutura da atividade oferece para que a aplicação
armazene qualquer informação importante que pode
vir a ser necessário caso a atividade volte a ser
executada em primeiro plano;
• onStop – Chamado quando a atividade está
prestes a ser eliminada;
• onDestroy – Última chance de fazer qualquer
processamento antes da destruição total da atividade;
Pela lista anterior, pode-se claramente observar que as
atividades exercem um papel fundamental no
desenvolvimento nativo Android. Ela tem um ciclo de vida
muito útil e bem definido (como também exibido na Figura 1,
que exibe o ciclo de vida das Atividades). Desenvolvedores
devem saber lidar com as chamadas durante o ciclo de vida de
uma tela para que a aplicação além de funcionar de forma
correta, não apresente problemas durante sua execução e o
principal, utilize ao mínimo os recursos do dispositivo
poupando sua bateria.
T.I.S. 2015; 4 (1): 78-87

Figura 1. Ciclo de vida de uma atividade em Android
(ROGERS; LOMBARDO; MEDNIEKS; MEIKE, 2009)
B) Serviços
Segundo (ROGERS; LOMBARDO; MEDNIEKS;
MEIKE, 2009), serviços são estruturas computacionais que se
assemelham aos serviços ou daemons de sistemas
operacionais desktop e assim como as atividades também são
trechos de código com a diferença que é executada em
segundo plano a partir do momento que são criadas até o
desligamento da mesma seja por conta da sua rotina de
execução ou pelo desligamento do aparelho e normalmente
não tem interface com o usuário. Um bom exemplo é um
serviço que tem como objetivo a execução de uma lista de
músicas onde mesmo quando o usuário troque de aplicativo, a
música deve continuar executando.
C) Receptores de Broadcast e Intenção
Segundo (ROGERS; LOMBARDO; MEDNIEKS;
MEIKE, 2009), receptores de broadcast respondem por
“chamados” de outras aplicações ou do próprio sistema
operacional Android, como por exemplo, o nível da bateria
em estado crítico. São, portanto também pequenos trechos de
código que são executados quando precisam responder a estas
solicitações oriundas de outras atividades.
D) Provedores de conteúdo
Tem por objetivo, segundo (ROGERS; LOMBARDO;
MEDNIEKS; MEIKE, 2009), compartilhar dados com outros
aplicativos. Por exemplo, a lista de contatos de um
dispositivo, que pode ser utilizada no seu aplicativo por meio
de um URI de acesso. A responsabilidade de saber que
T.I.S. 2015; 4 (1): 78-87
Marcos Roberto da Fonseca, Delano Medeiros Beder
aplicação deverá responder a esta solicitação é inteiramente do
sistema operacional Android. Basta o desenvolvedor solicitar
o recurso que julgar necessário.
Uma aplicação escrita nativamente em Android não precisa
necessariamente fazer uso de todos os componentes
oferecidos. A presente sessão mostra a estrutura oferecida pela
plataforma Android para que o leitor possa ter noção da sua
riqueza de controles disponíveis para uso.
III. ESTRUTURA DE UM PROJETO NATIVO ANDROID
Aplicações Android são desenvolvidas por meio de
ferramentas de desenvolvimento em um computador cujos
recursos computacionais são abundantes. Segundo (ROGERS;
LOMBARDO; MEDNIEKS; MEIKE, 2009), após o
desenvolvimento de toda ou parte da lógica da aplicação, o
desenvolvedor pode baixá-la em um dispositivo de destino
para testes e uso. Mas fica a disposição do desenvolvedor
depurar e/ou testar suas aplicações no emulador que o
ambiente de desenvolvimento oferece. Este emulador é
completo permitindo o teste de suas aplicações. Ou testá-las
em um dispositivo real.
O processo de instalação do ambiente Android é facilmente
encontrado documentado em páginas da internet e não faz
parte do escopo deste artigo.
Para a criação de um novo projeto, vários são os
componentes utilizados. A IDE, em conjunto com o plugin do
Android automatizam muitas tarefas necessárias para criação e
posteriormente, manter o funcionamento desses componentes.
Com a criação de um novo projeto o kit de desenvolvimento
executa, segundo (ROGERS; LOMBARDO; MEDNIEKS;
MEIKE, 2009) uma série de tarefas que auxiliam o
desenvolvedor já deixando criada uma primeira atividade que
nada mais é que a primeira interface com o usuário e também
cria uma série outros arquivos e diretórios que são
demonstrados segundo (LECHETA, 2010) na tabela abaixo.
Tabela 1. Estrutura de um projeto Android (LECHETA,
2010)
Como mencionado anteriormente durante a criação de um
novo projeto Android, alguns arquivos são criados
automaticamente. Dentre esses arquivos o Main.xml é o que
define a interface gráfica da tela. Por meio de tags o
desenvolvedor é capaz de compor sua tela com elementos
visuais que possibilitarão a interação com o usuário.
80
Aplicativos Android: desenvolvimento nativo x uso de ferramentas baseadas em padrões web
Outro arquivo que chama a atenção é o Strings.xml que
fica no diretório res e no subdomínio values, ele configura
toda a parte textual da aplicação de maneira centralizada, o
que não deixa de ser uma excelente prática de programação.
A idéia é que de forma prática, rápida, organizada e elegante a
aplicação possa ser traduzida.
Já a misteriosa classe R.java é repleta de constantes que
tem por objetivo facilitar o uso de recursos do próprio
projeto. Quando um novo recurso é adicionado no projeto,
como por exemplo uma imagem ou um botão essa classe é
alterada automaticamente de modo que ao término da
alteração a classe ganha uma nova constante que representa
este novo recurso criado. Portando nunca se deve alterar nada
desta classe.
Mas toda plataforma de desenvolvimento tem um arquivo
principal que centraliza todas as configurações da aplicação,
por exemplo, as atividades presentes na mesma, suas
permissões e etc. Este arquivo se chama
AndroidManifest.xml que é considerado o coração da
aplicação. Várias configurações são realizadas neste arquivo
que fazem com que a aplicação use recursos como internet,
envio de mensagens de texto além de outros mais detalhes
que devem ser explorados pelo leitor juntamente com a
documentação oficial do Android.
Até aqui ficou claro que uma aplicação Android
estruturalmente falando é muito bem definida. O uso correto
dessa estrutura define além das habilidades do desenvolvedor
a qualidade da aplicação. Portanto, conhecer bem a maneira
correta e eficiente de se criar um aplicativo é bem importante.
IV. CONTEXTUALIZANDO A TECNOLOGIA DE CRIAÇÃO DE
APLICATIVOS MÓVEIS USANDO TECNOLOGIAS WEB
Segundo (STARK; JEPSON, 2012), são utilizadas
basicamente três tecnologias para criação de aplicativos web:
HTML, CSS e JavaScript, de modo que no final da
codificação usando essa mistura possa resultar em um
aplicativo web puro que pode ser convertido em nativo, por
meio de frameworks como: PhoneGap, Rhmobile, Titanium
etc. Esta é uma abordagem no uso de tecnologias web e
frameworks que agem como drivers conversores, convertendo
linguagem web em linguagem nativa da plataforma. (STARK;
JEPSON, 2012)
A) HTML
Segundo (STARK; JEPSON, 2012), quando estamos
navegando na internet, visualizamos em nossos navegadores
documentos de texto, cujo texto é encapsulado em tags
HTML que define a estrutura do documento, orientando o
navegador a exibir da melhor maneira as informações de
forma que faça sentido.
B) CSS
É uma linguagem que, segundo (STARK; JEPSON, 2012),
é usada para definir o visual de um documento HTML.
Constitui basicamente em um documento de texto com
propriedades definidas em uma especificação que recebem
81
valores apropriados.
C) JavaScript
Segundo (STARK; JEPSON, 2012), é uma linguagem que
quando acoplada ao HTML adiciona a este interatividade.
Encontramos na internet, vários exemplos de documentos
HTML que “ganham vida”, usando JavaScript, como por
exemplo as validações dos dados digitados em um formulário.
Porém JavaScript tem comportamentos diferentes em
navegadores diferentes, por questões de suporte a tecnologia.
Neste contexto, a biblioteca chamada JQuery, que é
fundamental, pois resumidamente faz com que o mesmo
código (script JavaScripo) criado tenha o mesmo
comportamento em navegadores diferentes.
V. GANHANDO FORMA DE APLICATIVO
Com a intenção de melhorar o entendimento do presente
artigo, a sessão que aqui se inicia apresenta ao leitor
fragmentos de um exemplo simples, usados na criação de um
aplicativo institucional para o Departamento de Computação
da Universidade Federal de São Carlos. O presente protótipo é
diferente do proposto inicialmente, que seria baseado na
aplicação web criada como parte obrigatória no Curso de Pós-
Graduação Lato Senso do Departamento pelo fato de o
protótipo inicial consumir serviços web e o autor não
conseguiu realizar com sucesso o consumo dos mesmos. Por
isso a opção de apresentar fragmentos da criação do aplicativo
institucional.
Esta seção admite que o leitor tenha conhecimento das
tecnologias aqui apresentadas. A explicação detalhada de
código-fonte não faz parte do escopo desse artigo. Portando
considera-se prévio conhecimento do leitor.
A primeira ação a ser executada é a criação de um arquivo
CSS, onde nele deverá conter a configuração de estilo geral
para nossa aplicação, conforme a Figura 2.
Figura 2. Estilo geral da aplicação (STARK; JEPSON, 2012)
Como observado na Figura 2, foi definido para toda a
aplicação uma cor de fundo e de fonte, um tipo de letra (que
só terá efeito em dispositivos que não são baseados no
Android, pelo fato de o mesmo ter um conjunto de letras
criadas especialmente para dispositivos móveis Android),
tamanho da letra e as margens internas e externas do
aplicativo.
A partir do estilo padrão da aplicação o próximo passo é a
estilização do cabeçalho, que nada mais é que uma barra de
títulos que pode ser clicada. Seu código HTML é simples,
como demonstra a Figura 3, porém acoplada a estilização,
exemplificada na Figura 4, resulta num efeito visual
agradável.
T.I.S. 2015; 4 (1): 78-87
 Marcos Roberto da Fonseca, Delano Medeiros Beder

Figura 3. Código HTML do cabeçalho da aplicação

(STARK; JEPSON, 2012)

Figura 4. Estilo que desenha o cabeçalho da aplicação (STARK; JEPSON, 2012)

Os próximos componentes que irão receber a estilização que estiliza uma lista não ordenada, simples como da Figura
são os menus de navegação, usando o código CSS da Figura 5 6.

Figura 5. Código que estiliza uma lista não ordenada (STARK; JEPSON, 2012)

Figura 6. Código HTML de lista não ordenada (STARK; JEPSON, 2012)

Até a versão atual da aplicação consegue-se um bom visual na Figura 7 adiciona uma fina sombra branca no texto do
com quantidade reduzida de código. cabeçalho.
Com técnicas um tanto quanto avançadas de CSS é possível
dar um ar de sofisticação ao aplicativo. O exemplo impresso

Figura 7. Cabeçalho com sombra (STARK; JEPSON, 2012)

T.I.S. 2015; 4 (1): 78-87 82

Aplicativos Android: desenvolvimento nativo x uso de ferramentas baseadas em padrões web
Chegando ao final da estilização básica da aplicação, é a
hora de deixar os menus com mais similaridade a uma
aplicação móvel arredondando seus cantos. Como
exemplificado na Figura 8, que são segundo (STARK;
JEPSON, 2012) pseudoclasses. Consegue-se estilizar alguns
elementos que estejam de acordo com alguns critérios, como
por exemplo, se o elemento em questão está com o foco do
cursor, se o mesmo foi clicado entre outros. Por fim, no
primeiro momento, a aplicação de exemplo ficou como
demonstrada na Figura 8, com gradientes, cantos
arredondados, sombra no texto do cabeçalho, juntamente com
informações institucionais.
Figura 8. Resultado visual da primeira versão da aplicação
de exemplo
Figura 11. Código JavaScript/JQuery do botão de menu (STARK; JEPSON, 2012)
Por detalhe visual há um trecho CSS responsável por tornar
o botão menu com aparência de clicado, exemplificado na
Figura 12. Código CSS que quando pressionado o botão menu ele ganha aparência diferenciada (STARK; JEPSON, 2012)
83
Neste ponto da exemplificação da aplicação institucional,
será abordado um pouco sobre o comportamento da aplicação.
No primeiro momento serão escondidos os menus de
navegação de forma que eles não apareçam quando a página é
carregada. E o pequeno trecho de código exibido na Figura 9
faz exatamente isso.
Figura 9. Ocultação do menu quando a página é carregada
(STARK; JEPSON, 2012)
Por último e não menos importante entra no foco deste
exemplo o botão menu ele é estilizado pelo código da Figura
10, onde é configurado, respectivamente sua posição, altura,
estilo de texto, a posição do texto e a parte de uma única
imagem que é um importante recurso, pois reduz a quantidade
de imagens e também a quantidade de banda além de menor
tempo de carregamento.
Figura 10. Estilização do botão de menu (STARK;
JEPSON, 2012)
Neste ponto é hora de utilização de código JavaScript onde
sua tarefa principal é mostrar e esconder os menus da
aplicação. Como exemplificado abaixo, o algoritmo considera
o tamanho do dispositivo para ser usado, em seguida ele
esconde os elementos mencionados dentro da cláusula, é
também inserido uma função que adiciona ou remove as
classes indicadas no objeto em questão. O código JQuery é
exemplificado na Figura 11.
Figura 12.
T.I.S. 2015; 4 (1): 78-87

Até este ponto, foi exemplificada uma forma de como
converter uma página web em algo semelhante a um
aplicativo móvel.
VI. VIRANDO NATIVO
Segundo (STARK; JEPSON, 2012) o mercado móvel
mundial está repleto de variedades entre tipos de sistemas
operacionais e dispositivos. É a mesma coisa que acontece
com quem desenvolve aplicativos e páginas web: uma
infinidade de versões e navegadores que se comportam de
maneiras distintas em sistemas operacionais diferentes. Não
há uma forma rápida, barata e eficiente de se testar a mesma
aplicação web em todas as plataformas e navegadores. O
mesmo acontece com o mundo mobile.
Pensando em tratar essa diversidade, frameworks como
PhoneGap, Rhmobile, Titanium etc foram criados para
converter linguagem web em linguagem nativa (STARK;
JEPSON, 2012).
Entre as diversidades de frameworks o PhoneGap foi o
eleito para ser o foco deste artigo.
O PhoneGap, segundo (STARK; JEPSON, 2012) tem como
objetivo unir código e lógica web com as diversas APIs de
dispositivos móveis. Basicamente ele tem como base um
projeto nativo para cada uma das plataformas que ele suporta.
Cada projeto é composto de um navegador web com várias
permissões de uso de forma que este navegador possa usar os
auto-falantes, microfone, acelerômetro e câmera invocadas
por chamadas JavaScript. O resultado desta combinação é o
código HTML, CSS e JavaScript mais a API do PhoneGap
que encapsula o conteúdo web formando um aplicativo nativo
que pode ser distribuído ou publicado nas lojas de aplicativos
da devida plataforma.
A principal e notória vantagem é que o PhoneGap abstrai
os principais recursos das principais plataformas e o
desenvolvedor utiliza o mesmo código HTML, CSS e
JavaScript para todas as plataformas, ao contrário de quando
se trabalha de forma nativa, pois cada plataforma tem seu
jeito específico de se consumir seus recursos.
Mas, pode ser que desenvolvedores inexperientes não
estejam acostumados a utilizar uma rica e complexa interface
de desenvolvimento para compilar seu código HTML, CSS e
JavaScript, para torná-lo nativo. Pensando nesta possibilidade
e na tentativa de tornar o PhoneGap popular no mercado de
desenvolvimento, a empresa que o mantém criou uma solução
na internet que dispensa o uso de uma interface de
desenvolvimento. Neste construtor o funcionamento é
descomplicado e eficiente. Com prévio cadastro na página
web do projeto, http://build.phonegap.com, o usuário faz o
upload do código HTML, CSS e JavaScript e o próprio
Figura 13. Inclusão da biblioteca do PhoneGap no projeto
T.I.S. 2015; 4 (1): 78-87
Marcos Roberto da Fonseca, Delano Medeiros Beder
sistema gera para o desenvolvedor a aplicação nativa nas
diversas plataformas de forma a aumentar a produtividade,
reduzindo o tempo de produção das versões em diversas
plataformas e também reduzindo custos com aquisição de
equipamentos específicos para testes e compilação em outras
plataformas. Outro pronto vantajoso do uso dessa ferramenta é
que não requer nenhuma instalação ou configuração inicial
além do custo ser baixo se ultrapassar a cota gratuita. Mas o
uso da ferramenta prolonga o ciclo de desenvolvimento, no
caso de uma possível mudança no projeto, torna mais lento se
chegar à fase de testes em dispositivos não-emulados, requer
prévio processo de compilação e instalação que deve ser feito
manualmente.
Porém a conversão de um aplicativo escrito usando
tecnologias web em código nativo também pode ser feita
usando recursos próprios. Alguns detalhes de configuração
não serão abordados no presente artigo, mas pode ser
encontrado documentado nas páginas da internet, como por
exemplo, o download, instalação e configuração do Eclipse,
que é segundo (STARK; JEPSON, 2012) uma interface de
desenvolvimento de código aberto usada pelos
desenvolvedores para a escrita, compilação, execução e
depuração de todo tipo de projeto. A configuração de toda
base Android, o kit de desenvolvimento e outros programas
usados também não faz parte do escopo deste artigo.
Com tudo devidamente instalado e funcionando, deve-se
criar um novo projeto e nomeá-lo de acordo com as suas
necessidades. Deixe o Eclipse criar uma atividade. O
desenvolvedor pode colocar um nome a ela, de sua
preferência.
Dando continuidade, o desenvolvedor deve criar uma pasta
dentro da já existente pasta assets. É necessária esta criação,
para mantermos todo o código criado usando tecnologias web
padronizadas, dentro da estrutura do projeto Android. Como já
mencionado anteriormente, a pasta assets é reservada para
recursos externos a aplicação.
O próximo passo requer atenção. Deverá ser copiado todo o
conteúdo HTML, CSS e JavaScript feito, bem como todas as
dependências deste projeto, como imagens e fontes e colar
dentro da pasta criada anteriormente no projeto.
Agora é necessário obter uma versão do PhoneGap em sua
página oficial: http://phonegap.com/install.
Com a ultima versão em mãos, descompacte-a e nas
propriedades do projeto (botão direito do mouse no projeto na
opção propriedades), escolha a opção das bibliotecas externas
incluídas para o funcionamento do projeto (Java Build Path),
na aba libraries adicione o arquivo com extensão .jar chamado
“cordova” na sua versão correspondente, conforme indicado
na Figura 13.
84
Aplicativos Android: desenvolvimento nativo x uso de ferramentas baseadas em padrões web
Em seguida, adicione na pasta assets o arquivo cordova.js
que é uma biblioteca JavaScript com todos os métodos
necessários para o funcionamento de todas as ações que a
aplicação fará. Vale salientar que a adição dos arquivos
mencionados são exclusivos para o sistema Android.
O ultimo passo, consiste em alterar a atividade criada
durante a configuração da concepção do projeto. O código
dela deverá ficar como mostrado na Figura 14.
Figura 14. Alteração da atividade principal
Isso faz com que a atividade passe a herdar todas as
funcionalidades da classe DroidGap e aponte para o código
criado usando HTML, CSS e JavaScript. Assim, segundo
(STARK; JEPSON, 2012) o PhoneGap aciona um navegador
web com permissões para usufruto de recursos do dispositivo
que interpreta o código gerado. Ao executar a aplicação
utilizando, por exemplo, o emulador temos o seguinte
resultado, como mostrado na figura 15.
Figura 15. Resultado da aplicação nativa utilizando
PhoneGap
VII. TRABALHOS RELACIONADOS
85
Vários são os pesquisadores que utilizam como base o
PhoneGap na resolução de inúmeros problemas, sejam eles
específicos de uma organização ou rotineiros. A presente
sessão aponta outras pesquisas que utilizam somente o
PhoneGap como base de conversão de linguagem web em
linguagem nativa para justamente mostrar a força que esse
framework tem, seja no âmbito corporativo ou mesmo
acadêmico. O trabalho de pesquisa segundo (REICHERT;
TEODORO; BERLIN, 2013) propõe a criação de um
aplicativo que tem como objetivo auxiliar no aprendizado de
crianças com deficiência auditiva, na esperança de que fosse
possível contribuir com o ensino da língua portuguesa para
crianças especiais baseado em métodos já existentes. Os
autores deste trabalho mostraram tecnologias, formas e
métodos para a criação da aplicação, que utilizaria HTML5,
com telas que se adaptem a diversos aparelhos. Acoplado ao
HTML5, propõe também recursos adicionais como CSS,
JavaScript e JQuery, além do PhoneGap que transformaria o
jogo escrito nos padrões web em aplicativo nativo. Tendo em
vista que o trabalho desses autores é uma proposta de criação
os autores acreditam que a criação do proposto aplicativo
pode contribuir de forma significativa.
O PhoneGap também pode ser usado como base para
criação de aplicativos que utilizam recursos de geolocalização.
Segundo (JÚNIOR; OLIVEIRA; CARDOSO, JÚNIOR, s.d)
propõem com a criação de um aplicativo que auxilia na
localização dentro do campus da Universidade Federal de
Uberlândia, em Minas Gerais. O aplicativo é uma prova de
conceitos do uso do PhoneGap onde ele acrescenta no mundo
real, informações computadorizadas sobre o caminho a ser
seguido, levando o usuário até seu destino. O desfecho desta
pesquisa foi promissor, segundo seus autores. Eles também
garantem que a plataforma de desenvolvimento usando
tecnologias web padronizadas é simples e eficiente para o
desenvolvimento de aplicações e que futuramente pretendem
realizar integração com a câmera e fazer análise da utilização
do aplicativo a fim de contemplar mais pontos de interesse.
Existem diversas aplicações criadas com o PhoneGap no
âmbito corporativo. Segundo (SILVA; TIBOLA;
FERNANDES; DALBOSCO; RIEDER; PAVAN, s.d) que
construíram uma aplicação de cunho corporativo, sendo uma
primeira versão de um aplicativo de caderno de campo para
agricultores usando o PhoneGap. Segundo os autores há uma
tendência entre desenvolvedores a migração de sistemas
desktop para dispositivos móveis. O objetivo partia da
demanda por um aplicativo com diferentes plataformas
móveis que poderiam ser usadas em qualquer lugar. A
primeira versão contemplou autenticação de usuários, a
escolha do caderno de campo, uma tela principal, uma
listagem e a inserção de diferentes registros como
monitoramento de pragas, doenças e plantas daninhas. O
aplicativo consome WebServices de servidores remotos
usando padrão REST e JSON para troca de dados. Concluíram
que a criação do aplicativo híbrido é uma boa opção e que o
uso de tecnologias web é bastante fundamental para criar
aplicações flexíveis e padronizadas além da redução de custos
de desenvolvimento e o PhoneGap atende a integração entre
T.I.S. 2015; 4 (1): 78-87

HTML, CSS e JavaScript, com recursos nativos dos mais
diversos dispositivos móveis. Alguns pesquisadores tentam
elencar ótimas comparações entre as maneiras existentes de
desenvolvimento de aplicativos. O trabalho de pesquisa
segundo (SILVA; SANTOS, 2014) defende a idéia de que a
evolução dos celulares permitiu a criação de sistemas
operacionais mais avançados que por sua vez também
permitiu a criação de aplicativos melhores. Segundo a
pesquisa, o desenvolvimento de aplicativo que atenda a várias
plataformas reduz sua complexidade, porque deixa o código
mais enxuto, além de diminuir o tempo e o custo de
desenvolvimento e posterior manutenção. Garantem ainda que
o desenvolvimento de aplicativos web, usando tecnologias
padronizadas como HTML, CSS e JavaScript tem
comportamento bastante semelhante aos aplicativos nativos,
ao passo que a maioria dos dispositivos modernos possuem
robustos navegadores, proporcional o desenvolvimento desse
tipo de aplicativo dando melhor experiência de uso aos
usuários. Os autores defendem o uso de tecnologias híbridas
onde o PhoneGap pode ser usado para transformar código
CSS, HTML e JavaScript em aplicativos nativos e conclui
afirmando que as ferramentas utilizadas no desenvolvimento
permite que sejam reduzidos fatores como tempo, custo e
complexidade porém com certas limitações, de acordo com a
ferramenta utilizada. Ainda segundo a pesquisa os aplicativos
que podem atender a várias plataformas poderiam oferecer
vantagens até para os fabricantes das plataformas,
estimulando assim a criação de novos aplicativos escritos em
única vez e comercializados em várias lojas de aplicativos. O
trabalho em questão concluiu ainda que não existe um modelo
de desenvolvimento de aplicativos móveis que atenda a todas
as necessidades. É necessário conhecer todas as
particularidades do aplicativo para só assim decidir a melhor
forma de criá-lo.
VIII. CONCLUSÃO E TRABALHOS FUTUROS
O mercado móvel já é uma realidade. Com isso, gerou-se
um novo e bem atraente mercado para desenvolvedores e
usuários.
Pensando neste mesmo raciocínio também se fez necessário
a criação de tecnologias capazes de prover a concepção de
aplicativos de forma relativamente rápida e de fácil
aprendizado. O uso do PhoneGap, bem como outros
frameworks se tornaram uma boa opção, porque seu ciclo de
desenvolvimento é reduzido e bem atraente. Também, por
outro lado, a criação de aplicativos nativos, principalmente na
plataforma Android, tem inúmeras vantagens, pois se tem o
domínio da execução da aplicação em todos os sentidos.
Mas a questão não é a aplicação em si, mas a maneira de
como o desenvolvedor irá se preparar pra criá-la. Isso pode
variar e muito de acordo com o contexto dela. Por isso deve
ter muito conhecimento do que esta aplicação irá fazer
realmente. Suas funcionalidades devem sempre estar muito
bem definidas para que seja escolhido de forma certeira o
método que se irá utilizar no desenvolvimento. E é este o
paralelo que se formou no presente artigo. O motivo pelo qual
criamos uma aplicação, e qual tecnologia usar: nativa ou nos
T.I.S. 2015; 4 (1): 78-87
Marcos Roberto da Fonseca, Delano Medeiros Beder
moldes da web, tornando-a nativa posteriormente. Cabe ao
desenvolvedor agora opinar já que agora conhece e sabe as
principais vantagens e desvantagens de usar uma ou outra.
O mais importante é ser tomada a decisão correta na hora
da definição da tecnologia usada, um erro neste momento
pode até vir a comprometer a aplicação, pois depois de
lançada nas lojas de aplicativos, uma possível reescrita em
código nativo, por exemplo, se tornaria bem caro, na questão
tempo e custo. E o inverso é verdadeiro também. Uma
aplicação lançada com tecnologias web e depois virando
nativa com o PhoneGap é inviável reescrevê-la para
linguagem nativa também pelo mesmo motivo: se tornaria
caro, na questão tempo e custo.
A equipe de desenvolvimento tem que ter maturidade o
bastante para se chegar num acordo entre uma ou outra
tecnologia. Acredita-se que com o presente artigo, o leitor
possa ter ganhado conhecimento sobre as tecnologias. O
PhoneGap veio para auxiliar os desenvolvedores. Ela não é
uma tecnologia que consegue abranger todos os bons pontos
que o código nativo consegue. Mas, por outro lado, ela
elimina a complexidade de desenvolvimento, tornando o seu
ciclo mais rápido e barato. E é assim mesmo: com tecnologias
já conhecidas, segundo (STARK; JEPSON, 2012) como
HTML, CSS e JavaScript você já pode desenvolver
aplicativos Android.
Como futuros trabalhos, destaca-se a necessidade de se
aprofundar os conhecimentos em criação de aplicações usando
padrões web e tornado-a nativa usando o PhoneGap. Pretende-
se continuar o desenvolvimento da aplicação institucional
apresentada no presente artigo de novo que esta possa
consumir serviços providos por um servidor remoto, por meio
de WebServices fazendo uso do padrão REST e JSON para
troca de dados, fazendo com que a aplicação se torne mais
dinâmica.
IX REFERÊNCIAS .
BERLIM, Thiago Luis; REICHERT, Jennifer Ribas;
TEODORO, Fabricia. O Uso da Tecnologia Móvel para o
Auxilio ao Aprendizado de Crianças com Deficiência
Auditiva. Faculdade Avantis. Balneário Camboriú/SC, s.d.
JÚNIOR, Gesmar de Paula Santos; OLIVEIRA, Alexandre
Cardoso; JÙNIOR, Edgard Afonso Lamounier. Aplicação
Multiplataforma da Realidade Aumentada Móvel para
Geolocalização utilizando o PhoneGap. Programa de Pós-
Graduação em Engenharia Elétrica. Universidade Federal
de Uberlância. Uberlândia/MG, s.d.
LECHETA, Ricardo R. Google Android: aprenda a criar
aplicações para dispositivos móveis com o Android SDK.
2ª Edição revista e ampliada. São Paulo: Novatec Editora,
2010.
ROGERS, Rick; LOMBARDO, John; MEDNIEKS, Zigurd,
MEIKE; Blake. Desenvolvimento de aplicações Android:
programação com o SDK do Google. Tradução Lia
Gabriele Regius. São Paulo: Novatec Editora, 2009.
SILVA, Maicon Anderson Mattos da; TIBOLA, Casiane
Salete; FERNANDES, Jose Mauricio Cunha;
DALBOSCO, Jaqson; RIEDER, Rafael; PAVAN,
86
Aplicativos Android: desenvolvimento nativo x uso de ferramentas baseadas em padrões web
Willingthon. Desenvolvimento de um Caderno de Campo Aparelhos Celulares. São Carlos/SP: T.I.S. p. 162-170.
para Plataformas Móveis utilizando PhoneGap. Maio – Agosto 2014.
Universidade de Passo Fundo. Passo Fundo/RS, s.d. STARK, Jonathan; JEPSON, Brian. Construindo aplicativos
SILVA, Marcelo Moro; SANTOS, Marilde Terezinha Prado. Android com HTML, CSS e JavaScript. – São Paulo:
Os Paradigmas de Desenvolvimento de Aplicativos para Novatec Editora, 2012.

87 T.I.S. 2015; 4 (1): 78-87