Desenvolvimento de um Caderno de Campo para Plataformas Móveis utilizando PhoneGap

Transcrição

1 Desenvolvimento de um Caderno de Campo para Plataformas Móveis utilizando PhoneGap Maicon Anderson Mattos da Silva 1, Casiane Salete Tibola 2, Jose Mauricio Cunha Fernandes 2, Jaqson Dalbosco 1, Rafael Rieder 1, Willingthon Pavan 1 1 Universidade de Passo Fundo (UPF) Caixa Postal 611 CEP Passo Fundo RS Brazil 2 Embrapa Brasileira de Pesquisa Agropecuária (EMBRAPA Trigo) Caixa Postal 451 CEP Passo Fundo RS Brazil maiconmattos@gmail.com, {casiane.tibola,mauricio.fernandes}@embrapa.br, {jaqson,rieder,pavan}@upf.br Abstract. This paper discusses the initial developing of a field book application for mobile platforms using PhoneGap, a framework for hybrid web solutions. The work quickly introduces the PhoneGap concept, its insertion in a case study of digital traceability, and the creation and installation process of the application on mobile devices. Resumo. Este artigo aborda a fase inicial de desenvolvimento de um aplicativo de caderno de campo para plataformas móveis utilizando a ferramenta PhoneGap, um framework para soluções web híbridas. O trabalho apresenta rapidamente o conceito do PhoneGap, sua inserção em um estudo de caso de rastreabilidade digital, e o processo de criação e instalação do aplicativo em dispositivos móveis. 1. Introdução A adesão aos dispositivos móveis é evidente em nosso cotidiano. Smartphones e tablets oferecem recursos que vão além da simples comunicação. De modo geral, por meio destes equipamentos podem-se realizar variadas tarefas, como buscar informações, fazer compras e exercer atividades profissionais utilizando diferentes aplicativos. Com relação ao uso de aplicativos, o usuário tem a liberdade de escolher sua tecnologia e também os recursos computacionais que lhe são úteis. Para uma equipe responsável pelo desenvolvimento destes produtos, decisões tecnológicas capazes de contemplar funções para a maioria dos usuários são fundamentais. Questões como portabilidade, plataforma operacional, recursos nativos e recursos web são exemplos de requisitos que precisam ser considerados no projeto e na construção destas ferramentas. Uma vantagem em adotar tecnologias web em um aplicativo é a facilidade de aprendizado com relação aos possíveis recursos disponíveis tanto para a equipe de desenvolvimento, quanto para os usuários finais. Outra vantagem é o fato destas tecnologias seguirem um padrão internacional, que permite sua execução de forma consistente e independente de plataforma seja para soluções móveis ou desktop [Zemel, 2012]. Porém, uma diferença significativa entre aplicativos que utilizam recursos nativos e aqueles que usufruem de tecnologias web diz respeito à forte interação que

2 aplicativos nativos têm com recursos do dispositivo, como câmeras e acelerômetros. Por outro lado, aplicativos web são limitados ao suporte do browser em que são executados. Para preencher a lacuna entre aplicações nativas e web, mantendo a portabilidade da solução, faz-se necessário o uso de uma abordagem de desenvolvimento híbrido, em que tecnologias web (HTML, CSS, Javascript) são utilizadas em conjunto com recursos nativos de uma interface de programação. Para tanto, este trabalho tem como objetivo demonstrar o processo de desenvolvimento de um aplicativo móvel, do tipo híbrido, lançando uso de uma ferramenta para este propósito de integração, chamada PhoneGap. Como estudo de caso, um aplicativo de caderno de campo mobile foi implementado, possibilitando aos usuários o registro e o acesso em tempo real de anotações referentes ao trabalho executado no campo. Para tanto, este artigo está assim organizado: a Seção 2 apresenta brevemente a ferramenta PhoneGap, enquanto a Seção 3 mostra o estudo de caso que envolve uma solução de caderno de campo. A Seção 4 descreve o processo de desenvolvimento do aplicativo, mostrando um resultado visual de sua instalação. Por fim, a Seção 5 apresenta as conclusões do trabalho. 2. O PhoneGap O PhoneGap ( é uma ferramenta que possibilita o desenvolvimento de aplicações para dispositivos móveis por meio de tecnologias web padronizadas, como HTML, CSS e Javascript [Wargo, 2012]. Este framework permite ao desenvolvedor criar soluções nativas, independentes de plataforma, utilizando um serviço de empacotamento de aplicações chamado PhoneGap Build ( Desta forma, o aplicativo pode ser configurado universalmente para executar e trocar informações com diferentes dispositivos e sistemas operacionais [Munro, 2012]. Como exemplos de aplicativos desenvolvidos com esta ferramenta, no âmbito da Agricultura, podem-se citar o Fresh Food Finder ( e o Live Gluten Free ( 3. Estudo de caso Uma tendência no campo de desenvolvimento de sistemas é a migração de soluções que rodam em estações desktop para dispositivos móveis. Para tanto, esta seção aborda a análise de um sistema existente e que pode ser migrado para um aplicativo mobile A Rastreabilidade Digital De acordo com Tibola et al. (2013), a rastreabilidade digital é um sistema computadorizado utilizado para identificar procedência e disponibilizar informações sobre manejo e qualidade de produtos, tendo como referência registros obtidos em todas as etapas da cadeia produtiva. No campo da produção de trigo, por exemplo, este sistema permite registrar informações como cultura, rotações, tratamento de sementes, métodos de fertilização, monitoramento de doenças e pragas, e aplicações de pesticidas. Além das facilidades destacadas, Tibola et al. (2013) ressaltam a possibilidade de registrar uma grande massa de informações em um banco de dados, de utilizar mapas

3 digitais georreferenciados para localização de parcelas da propriedade; e de associar processos do sistema de produção a outras fontes de informação disponíveis na internet O sistema Caderno de Campo Web Uma aplicação prática do uso da rastreabilidade digital para o setor agrícola é o Caderno de Campo Web ( produzido em parceria pela EMBRAPA Trigo e pela UPF. Este sistema está em operação desde 2012, possui mais de 300 usuários, e tem por objetivo identificar a procedência e o manejo adotado na produção e pós-colheita do trigo. Por meio de seus recursos, registros podem ser visualizados ou impressos em formato de relatórios diretamente de navegadores web O sistema Caderno de campo Mobile A demanda para a criação do Caderno de Campo Mobile tem por objetivo criar um aplicativo que seja compatível entre diferentes plataformas móveis, que se adapte aos diferentes contextos de resolução de tela dos dispositivos utilizados, e que possam ser utilizados em qualquer lugar pelos seus usuários. Para tanto, algumas funcionalidades do sistema existente foram elencadas como prioritárias para o desenvolvimento de uma primeira versão. Entre os recursos, podemse destacar o controle de autenticação, a seleção do caderno de campo, o menu de funcionalidades, a listagem e o registro de monitoramentos de pragas, a listagem e o registro de monitoramentos de doenças, e a listagem e o registro de monitoramentos de plantas daninhas. A Figura 1 ilustra estas funcionalidades e o fluxo da aplicação. Figura 1. Fluxo da aplicação Caderno de Campo Mobile. 4. Tecnologias e funcionamento do aplicativo desenvolvido Esta seção mostra as ferramentas utilizadas para desenvolver o aplicativo apresentado na Seção 3.3, bem como seu modo de funcionamento e interação com o usuário.

4 4.1. Ferramentas utilizadas Para o desenvolvimento da aplicação foram utilizadas as seguintes ferramentas: Eclipse IDE: ambiente de projeto e desenvolvimento da solução; Github: serviço de repositório, compartilhamento e controle de versão; egit: plugin do Eclipse para gerenciamento de repositórios; jquery: framework Javascript utilizado para manipulação de modelos de objetos de documentos web através de seletores; jquery Mobile: pacote de recursos do framework jquery que contém funcionalidades específicas para o contexto de dispositivos móveis. De acordo com Reid (2011) e Firtman (2012), esta biblioteca fornece também uma série de listeners de eventos característicos de dispositivos móveis, como touch e swipe; PhoneGap Javascript API: biblioteca que permite acessar recursos nativos dos dispositivos móveis; PhoneGap Build: ferramenta que gera aplicativos móveis multiplataformas Acessando dados do servidor Para manipular os dados referentes aos cadernos de campo, o aplicativo acessa um servidor remoto que disponibiliza uma série de webservices implementados no padrão arquitetural REST. O formato JSON é empregado para a troca de dados entre o servidor e a aplicação durante uma sessão. A Figura 2 ilustra este processo. Figura 2. Acesso ao servidor REST e troca de dados via JSON. O framework jquery oferece uma interface que facilita a comunicação com os serviços REST e JSON. As requisições são feitas de maneira segura, utilizando operações de submissão entre as partes do sistema. Nestes encaminhamentos, os dados podem ser manipulados e destinados às tarefas solicitadas pelo usuário. Por exemplo, a montagem de uma lista de cadernos de campo na tela do celular (Figura 3) poderia ser uma ação comum disparada pelo usuário no aplicativo, e construída dinamicamente com dados obtidos do servidor Notificando o usuário Uma característica comum em qualquer sistema de informação, independente do contexto (desktop ou mobile), são as notificações ao usuário. Estas mensagens são importantes, pois informam o sucesso ou a falha na execução de alguma tarefa.

5 Figura 3. Listagem de cadernos de campo, nas plataformas Android (esquerda) e ios (direita). Para aplicativos móveis, uma forma de notificar o usuário é por meio de caixas de diálogo. No entanto, cada plataforma (Android e ios, por exemplo) tem seu estilo de apresentação diferente, bem como a forma de envio das mensagens para o sistema. Para mostrar notificações nativas, o PhoneGap disponibiliza uma interface que permite o tratamento de mensagens com código Javascript, sem a necessidade de identificar qual plataforma a aplicação web está sendo executada. A Figura 4 mostra como a caixa de notificação é apresentada nos sistemas Android e ios. Figura 4. Caixa de notificação nativa, nas plataformas Android (esquerda) e ios (direita) Instalando o aplicativo no dispositivo Uma vez gerada a aplicação no PhoneGap Build, é possível baixar o arquivo de instalação, conforme a plataforma operacional presente no dispositivo do usuário. Para fins de validação, o Caderno de Campo Mobile foi testado em dois

6 ambientes: um emulador do aparelho Google Nexus 7 (Android 2.3.3) e um aparelho iphone 3GS (ios 6.1.3). A Figura 5 mostra a aplicação instalada nos dispositivos. Figura 5. Aplicativo instalado nos dispositivos. 5. Considerações finais Ao longo desse trabalho, pode-se observar que a abordagem de desenvolvimento de aplicativos híbridos é uma boa opção quando se faz é necessário o uso de soluções independentes de plataforma. Neste contexto, o uso de tecnologias web é fundamental para a criação de soluções flexíveis, padronizadas e de fácil aprendizado ao usuário final. Além disso, sua adoção reduz o custo de desenvolvimento, uma vez que os recursos computacionais provêm de softwares livres, e contemplam questões de portabilidade. Com relação ao PhoneGap, esta ferramenta atende a integração entre tecnologias web e recursos nativos de dispositivos móveis, permitindo o uso completo de todas as funcionalidades dos equipamentos. Outro ponto positivo desta suíte é a ferramenta PhoneGap Build que permite gerar aplicativos para várias plataformas, mantendo as funcionalidades e a eficiência da solução. Referências Firtman, J. (2012), jquery Mobile: up and running, O'Reilly Media. Munro, J. (2012), 20 Recipes for Programming PhoneGap: cross-platform mobile development for Android and iphone, O'Reilly Media. Reid, J. (2011), jquery Mobile, O'Reilly Media. Tibola, C. S. e Fernandes, J. M. C. e Dalbosco, J. e Pavan, W. (2013), Sistema de Rastreabilidade Digital para Trigo, Embrapa. Wargo, J. M. (2012), PhoneGap Essentials: building cross-platform mobile apps, Addison-Wesley Professional. Zemel, T. (2012), Web Design Responsivo: páginas adaptáveis para todos os dispositivos, Casa do Código.