PROGRAMAÇÃO PARA DISPOSITIVOS MÓVEIS - USANDO A CÂMERA. Prof. Angelo Augusto Frozza, M.Sc.

Transcrição

1 PROGRAMAÇÃO PARA DISPOSITIVOS MÓVEIS - USANDO A CÂMERA Prof. Angelo Augusto Frozza, M.Sc.

2 ROTEIRO Introdução API de Câmera do PhoneGap Atividade prática

3 INTRODUÇÃO Para adicionar o suporte a Câmera fotográfica no app HTML 5 híbrido é necessário usar a API específica do PhoneGap. API de Câmera do PhoneGap Recursos possíveis: Tirar fotos com a Câmera Utilizar fotos armazenadas em um álbum de fotos no DM Alterar diversas configurações

4 INTRODUÇÃO O que é necessário para a app: Código HTML 5 JQuery Mobile (3 arquivos) API de Camera do PhoneGap (cordova.x.x.x.js) Para testar: Armazenar o código no GitHub Gerar o app com o PhoneGap Build Testar o app em um DM (ou em um emulador*)

5 API DE CÂMERA DO PHONEGAP Capturar fotos Usar o método para capturar fotos ou recuperar uma foto de um álbum do DM Camera.getPicture(onCaptureSuccess, oncaptureerror, [cameraoptions]) A imagem é retornada como uma String base64 encoded ou como a URI para um arquivo de imagem.

6 API DE CÂMERA DO PHONEGAP Capturar fotos Camera.getPicture(onCaptureSuccess, oncaptureerror, [cameraoptions]) Parâmetros (*) : oncapturesucess função callback que fornece a imagem oncapureerror função callback que fornece uma mensagem de erro cameraoptions parâmetros opcionais para customizar a configuração da câmera (quality, destinationtype, sourcetype, allowedit, encondingtype, targetwidth, targetheight, mediatype, correctorientation, savetophotoalbum, popoveroptions).

7 API DE CÂMERA DO PHONEGAP Capturar fotos Camera.getPicture(onCaptureSuccess, oncaptureerror, [cameraoptions]) Parâmetros (*) : (*) OBSERVAÇÃO: As configurações dependem do suporte fornecido por cada DM. oncapturesucess função callback que fornece a imagem oncapureerror Caso o DM função não suporte callbackdeterminada que fornece configuração, uma mensagem ela de erro cameraoptions parâmetros será opcionais ignorada. para customizar a configuração da câmera (quality, destinationtype, sourcetype, allowedit, encondingtype, targetwidth, targetheight, mediatype, correctorientation, savetophotoalbum, popoveroptions).

8 API DE CÂMERA DO PHONEGAP Capturar fotos Especificamente para ios, usar o método Camera.cleanup(onSuccess, onerror) para remover arquivos temporários criados pela aplicação.

9 API DE CÂMERA DO PHONEGAP Capturar fotos Observações: A qualidade de imagem das fotos tiradas com a câmera em DM mais novos é muito boa; As imagens do álbum de fotos não serão alteradas a uma qualidade inferior, mesmo se um parâmetro de qualidade é especificado; Codificar imagens usando Base64 tem causado problemas de memória em alguns DM (iphone 4, BlackBerry Torch 9800) Portanto, é altamente recomendável utilizar 'Camera.destinationType = FILE_URI.

10 ATIVIDADE PRÁTICA Criar um app HTML 5 que utilize os recursos da Câmera do DM. Para realizar esta atividade você deve: a) Preparar o ambiente para testes Identificar e instalar um emulador de Android no computador. P.ex.: YouWave - emula de modo bastante preciso todo o universo do Android SDK Android permite emular todas as versões do Android; BlueStacks - apenas emula aplicativos do Android; WindowsAndroid - transforma o computador em um aparelho Android quase completo; Fazer um pequeno relato sobre os emuladores testados EXTRA: encontrar emulador para outras plataformas (WP, ios).

11 ATIVIDADE PRÁTICA b) Seguir um dos tutoriais indicados Exemplo de API de Câmera do PhoneGap* PhoneGap API Reference Camera

12 ATIVIDADE PRÁTICA c) Criar uma aplicação própria Por exemplo: O espelho Salvar e visualizar fotos de imóveis App apenas para acessar a câmera (sem fim específico)

13 REFERÊNCIAS PARA CONSULTA Exemplo de API de Câmera do PhoneGap* PhoneGap API Reference Camera Camera Como rodar programas do Android no Windows

14 REFERÊNCIAS PARA CONSULTA Guia: Emulando Android no Windows (2.3/3.0/4.0/4.2) Aprenda a rodar o emulador do Android no Windows MobiWiki

15 REFERÊNCIAS PARA CONSULTA Instalando PhoneGap com Eclipse IDE: preparando o ambiente para programação Android no Windows Getting started with PhoneGap in Eclipse for Android Apache Cordova