sexta-feira, 12 de setembro de 2014

Android - Capturando Imagens

Como capturar imagens com a câmera para dentro do meu projeto Android? Como selecionar uma imagem já existente em minha galeria?

Sem mais enrolação, vamos ao passo-a-passo!

OBS.: Se você já desenvolve para Android e/ou já tem um bom conhecimento da linguagem e não precisa de todo um passo-a-passo básico, avance direto para o passo 7 deste tutorial. ;)

1) Utilizando o Eclipse ADT como IDE de desenvolvimento, crie um novo projeto Android:

 

Vamos dar o nome de nosso projeto de "ProjetoCapturaImagens". Utilizaremos como como SDK mínima a API 14 (que já é suficiente para englobar a GRANDE quantidade de aparelhos utilizados atualmente segundo o próprio site Android Developer).


Clique em "Next" e certifique-se de "checkar" (odeio esse termo) a opção "Create Activity" e fazendo isso é só clicar em "Next" (dei o nome de "ProjetoCapturarImagemActivity" para a minha Activity principal), "Next" e "Finish"!

2) Como estamos falando de algo relativamente simples, iremos utilizar apenas a própria Activity criada automaticamente pelo Eclipse ADT, mas antes de modificarmos qualquer coisa em nossa Activity, precisamos deixar explicito em nossa aplicação que utilizaremos a câmera do dispositivo ao qual nossa aplicação será instalada. Fazemos isso incluindo o seguinte trecho em nosso arquivo "AndroidManifest.xml":

3) Ainda no mesmo arquivo, informamos que utilizaremos a "feature" de câmera porém ela não será obrigatória para se usar a aplicação (até porque também utilizaremos a galeria). Fazemos isso incluindo no "AndroidManifest.xml" a seguinte instrução:


Por fim, nosso arquivo "AndroidManifest.xml" ficará assim:


OBS.: Note que dei o nome da minha Activity de "CapturaImagemActivity", se você seguiu todos os passos com as configurações padrão na criação do projeto, sua Activity deverá estar nomeada como "MainActivity" e seu arquivo de layout como "activity_main.xml". Isso não interfere em nada ;)

4) Agora vamos montar o layout de nossa aplicação. Fazemos isso modificando o nosso arquivo de layout que se encontra no diretório de nosso projeto na pasta "res/layout". Vamos montar a seguinte tela:


Onde teremos uma área que servirá para mostrar a imagem capturada (seja da câmera ou da galeria), um botão para capturar a imagem ativando a câmera, um segundo botão para capturar a imagem direto da galeria e um terceiro para remover da tela a imagem capturada.
Nosso arquivo de layout "activity_main.xml" (no meu caso "activity_projeto_capturar_imagens") ficará assim:


Note que todos os textos da tela estão sendo referenciados do arquivo de "strings" do projeto que se encontra no diretório do projeto na pasta "res/values/strings.xml". Essa é uma boa prática e eu fortemente recomendo para além da questão de organização, facilitar o trabalho de tradução do aplicativo para outros idiomas (caso queira). Seu arquivo "strings.xml" deve ficar assim:


5) Agora sim, podemos em fim ir para o código da nossa Activity! Vamos começar criando objetos relativos aos componentes que temos em nosso arquivo de layout (botões e imagem) e vinculando-os para manipularmos tais componentes através do código em nossa Activity.

Crie atributos globais para sua Activity referentes aos três botões da tela e à imagem que será mostrada. Crie também dois atributos constantes que utilizaremos mais tarde para distinguir se a imagem foi capturada pela câmera ou selecionada da galeria. Ficará assim:


Vamos criar um método chamado "inicializarComponentes" que será responsável por vincular nossos objetos com os componentes de nosso layout:


E chamamos esse método dentro de nosso método "onCreate" criado automaticamente pelo Eclipse ADT. Caso não tenha feito isso, crie-o trocando o layout "activity_projeto_capturar_imagens" pelo nome do seu arquivo de layout. Ficará assim:


Pronto, agora que temos como manipular os componentes de nosso layout (os três botões e a imagem), vamos definir "ações e comportamentos" para nossos componentes, começando pelos botões. 

6) Ao clicar em qualquer dos botões de nosso layout (câmera, galeria ou deletar imagem), um evento é disparado e é através desse evento (click) que identificamos qual botão foi clicado e o qual ação executar a partir desse clique. Para que nossa Activity esteja apta á capturar e tratar esses eventos de clique temos que implementar uma interface chamda "OnClickListener" do pacote "android.view" (cuidado para não utilizar a interface do pacote "android.content"). Adicione a declaração de que está implementado tal interface junto à assinatura de sua classe Activity:


Feito isso, sobrescreva o método "onClick" (obrigatório para implementação desta interface).:


 Agora vamos declarar a nossa Activity como sendo a classe responsável por tratar o evento de clique de nossos botões através do método "setOnClickListener" alterando o nosso método "inicializarComponentes" deste modo:


Percebe-se que os três botões de nosso layout terão seus eventos de "clique" tratados pela mesma classe (nossa Activity) e pelo mesmo método ("onClick" que sobrescrevemos). Devemos então distinguir dentro de nosso método "onClick" qual botão está sendo clicado. Verificamos isso desta forma:


7) Finalmente, o pulo do gato! Até aqui fizemos nada mais que montar e configurar uma tela em Android que até o momento nada faz! Agora vamos ao que interessa. 
Como tudo em Android é feito através de "Intents", aqui não vai ser diferente. Criaremos um objeto "Intent" onde sua ação dependerá de qual botão de nosso layout foi clicado. Caso o botão clicado tenha sido o de capturar imagem através da câmera utilizaremos a ação de "MediaStore.ACTION_IMAGE_CAPTURE", caso tenha sido o botão de capturar imagem direto da galeria quem tenha disparado o evento utilizaremos a ação "Intent.ACTION_PICK" e a Uri "android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI", ambos "Intents" sendo "startados" (outro termo que odeio) para retornarem com algum resultado. Para o botão de deletar apenas anularemos o "bitmap" do nosso objeto relativo ao componente de imagem de nosso layout. 

Bom, chega de texto e vamos à imagem de como fica tudo isso no nosso método "onClick":


8) Estamos quase lá! Do jeito que está já conseguimos tirar a foto com a câmera de nosso dispositivo e também já conseguimos selecionar a imagem direto de nossa galeria, a questão é, o que estamos fazendo com a imagem capturada? Nada! Se iniciamos (melhor que "startamos" rsrs) nosso "Intent" com o método "startActivityForResult" devemos implementar o método "onActivityResult" para recuperarmos o retorno (imagem) relativo ao nosso "Intent".

Primeiro para o caso de usarmos a câmera, temos que identificar qual "Intent" que está nos retornando algo (para isso que criamos aquelas duas constantes lá no início, lembra? rsrs) depois recuperamos o "Bitmap" relativo à foto tirada pela câmera e por último mostramos a foto disponibilizando-a através de nosso objeto relativo ao componente de imagem de nosso layout. Desta forma:


Como a parte de selecionar a imagem direto da galeria é um pouco mais complicada (por incrível que pareça), comentei linha por linha do código que ficou auto explicativo e por isso vou poupar texto novamente e dar lugar à imagens:


É isso aí!! Se tudo ocorreu bem e você seguiu todo o passo-a-passo, certamente você terá em mãos uma aplicação que captura imagens tanto da câmera quanto direto da galeria! ;)

Faça download do código fonte desta aplicação AQUI.

Bem didático (até demais eu sei) mas a medida que os tutoriais vão ficando mais complexos eu irei focando mais na solução específica do que o projeto como um todo. Prometo! rsrsrs.

Um comentário:

  1. Prezado(a),

    Percebemos que seu site oferece muitos arquivos para baixar de forma indireta, sendo necessário o armazenamento destes em algum lugar. O http://Minhateca.com.br é um site de armazenamento e compartilhamento de arquivos com espaço ILIMITADO e totalmente gratuito! Sem tempo de espera ou qualquer restrição, o download é ilimitado e super rápido - 100% GRATIS! Porque não experimenta usar nosso site para hospedar os seus arquivos?

    Esperamos poder contar com você e saiba que estaremos trabalhando para te oferecer o melhor!

    Abraços da Equipe Minhateca.

    ResponderExcluir