Capítulo 01 - Fundamentos de Android e o HelloWorld

Android Básico – Hello World!

M.Sc. Márcio Palheta 2/94

Instrutor

● Programador desde 2000

● Aluno de doutorado

● Mestre em informática pelo ICOMP/UFAM

● Especialista em aplicações WEB – FUCAPI

● marcio.palheta@gmail.com

● sites.google.com/site/marciopalheta

M.Sc. Márcio Palheta 3/94

Agenda

● Dispositivos e compatibilidade

● Instalação do ambiente de programação Android

● Primeira aplicação android – Hello World!

● Trabalhando com o simulador

● Conceitos iniciais - Ciclo de vida de uma Activity

● Usando a pasta de recursos – RES

● Entendendo a classe R.java

● Componentes de tela – por dentro do XML

● Planejamento das telas baseadas em Layouts

M.Sc. Márcio Palheta 4/94

Dispositivos e compatibilidade

M.Sc. Márcio Palheta 5/94

Instalação do Android – ADT Bundle

● Android SDK (Software Development Kit) provê ferramentas para realização de builds, testes e debug

● ADT Bundle (Android Developer Tools) é o ambiente de desenvolvimento que traz Android SDK e a IDE Eclipse juntos, prontos para o trabalho.

● Baixe e descompacte o ADT Bundle:● http://developer.android.com/sdk/index.html

M.Sc. Márcio Palheta 6/94

Execução da IDE Eclipse

● Após descompactar o ADT Bundle, execute o eclipse

M.Sc. Márcio Palheta 7/94

Execução da IDE Eclipse

● Escolha um diretório

para sua área de

trabalho

M.Sc. Márcio Palheta 8/94

Tela de Boas Vindas!

M.Sc. Márcio Palheta 9/94

Atualização das ferramentas

● No menu principal, selecione: Android SDK Manager

● Neste curso, usaremos o Android 4.4 (API 19)

● É uma boa baixar a Google API

M.Sc. Márcio Palheta 10/94

Exercício 01: Minha primeira App● Menu File/New/Android Application Project

M.Sc. Márcio Palheta 11/94

Exercício 01: Configurações da App

M.Sc. Márcio Palheta 12/94

Exercício 01: Definição de layout

M.Sc. Márcio Palheta 13/94

Exercício 01: Activity e Layout

M.Sc. Márcio Palheta 14/94

O que foi gerado?

● OlaMundoActivity.java: Classe filha de Activity, reponsável por controlar uma tela da aplicação;

● R.java: Classe responsável pelo mapeamento dos elementos da view com model e cotroller.

OBS: NÃO alterar manualmente

● Pasta RES: Pasta de recursos da App, onde ficam as telas

● AndroidManifest.xml: Arquivo de configurações da app

M.Sc. Márcio Palheta 15/94

OlaMundoActivity.java

M.Sc. Márcio Palheta 16/94

OlaMundoActivity.java

Classe filhade Activity

M.Sc. Márcio Palheta 17/94

OlaMundoActivity.java

Classe filhade Activity

Método inicial

M.Sc. Márcio Palheta 18/94

OlaMundoActivity.java

Pluga a view no controller

Classe filhade Activity

Método inicial

M.Sc. Márcio Palheta 19/94

Recursos e a pasta RES

● RES é a pasta onde ficam os recursos de uma app

● RES/LAYOUT/ armazena as telas da aplicação, escritas em xml, como olamundolayout.xml

● RES/VALUES/ pasta que utiliza qualifiers para facilitar a internacionalização da aplicação:

– values: pasta padrão

– values-pt-rBR: português Brasil

– Values-en-rUS: inglês Estados Unidos● RES/RAW/ armazena arquivos de mídia, como mp3

ou vídeos

M.Sc. Márcio Palheta 20/94

Recursos e a pasta RES

● RES/DRAWABLE/ pasta que armazenas imagens da app.

● Usa qualifiers para definir a resolução a ser utilizada:

– res/drawable-ldpi: dispositivos com baixa resolução(muito raros)

– res/drawable-mdpi: dispositivos com resolução média(raros)

– res/drawable-hdpi: alta resolução(maioria)

– res/drawable-tvdpi: televisões

M.Sc. Márcio Palheta 21/94

/res/layout/olamundolayout.xml

M.Sc. Márcio Palheta 22/94

/res/layout/olamundolayout.xml

Modo gráfico

M.Sc. Márcio Palheta 23/94

/res/layout/olamundolayout.xml

Modo gráfico

Paleta decomponentes

M.Sc. Márcio Palheta 24/94

/res/layout/olamundolayout.xml

Modo gráfico

Paleta decomponentes

Pré-visualização

M.Sc. Márcio Palheta 25/94

/res/layout/olamundolayout.xml

M.Sc. Márcio Palheta 26/94

/res/layout/olamundolayout.xml

Modo de ediçãode XML

M.Sc. Márcio Palheta 27/94

/res/layout/olamundolayout.xml

Modo de ediçãode XML

Layout principalda tela

M.Sc. Márcio Palheta 28/94

/res/layout/olamundolayout.xml

Modo de ediçãode XML

Layout principalda tela

Atributos para ocupar a tela toda

M.Sc. Márcio Palheta 29/94

/res/layout/olamundolayout.xml

Componente de texto

Modo de ediçãode XML

Layout principalda tela

M.Sc. Márcio Palheta 30/94

/res/layout/olamundolayout.xml

Componente de texto

Modo de ediçãode XML

Layout principalda tela

Tamanho adequado ao

conteúdo

M.Sc. Márcio Palheta 31/94

/res/layout/olamundolayout.xml

Componente de texto

Modo de ediçãode XML

Layout principalda tela

Referência parao arquivo de I18N

/res/values/strings.xml

M.Sc. Márcio Palheta 32/94

/res/values/strings.xml

M.Sc. Márcio Palheta 33/94

/res/values/strings.xml

Arquivo usado Para I18N

M.Sc. Márcio Palheta 34/94

/res/values/strings.xml

Arquivo usado Para I18N

Chave usada na view

M.Sc. Márcio Palheta 35/94

/res/values/strings.xml

Arquivo usado Para I18N

Chave usada na view

Valor a serexibido na view

M.Sc. Márcio Palheta 36/94

Teste da App em emuladores

● É uma boa prática o uso de devices (tablets ou celulares) para testar as nossas Apps

● Outra opção para testes é o uso de simuladores

● Clique no ícone do Android Virtual Device Manager

● Na nova tela, clique no botão New

M.Sc. Márcio Palheta 37/94

Configurações do emulador

M.Sc. Márcio Palheta 38/94

Configurações do emulador

M.Sc. Márcio Palheta 39/94

Configurações do emulador

Nome dosimulador

M.Sc. Márcio Palheta 40/94

Configurações do emulador

Nome dosimulador

Tipo de devicea ser emulado

M.Sc. Márcio Palheta 41/94

Configurações do emulador

Nome dosimulador

Tipo de devicea ser emulado

Versão do Android que

deve será emulada no device

M.Sc. Márcio Palheta 42/94

Configurações do emulador

Nome dosimulador

Tipo de devicea ser emulado

Versão do Android que

deve será emulada no device

Ajuste o espaço de

armazenamento

M.Sc. Márcio Palheta 43/94

Configurações do emulador

Nome dosimulador

Tipo de devicea ser emulado

Versão do Android que

deve será emulada no device

Encerre asconfigurações

Ajuste o espaço de

armazenamento

M.Sc. Márcio Palheta 44/94

Iniciar o novo emulador

M.Sc. Márcio Palheta 45/94

Iniciar o novo emulador

Selecione o seuemulador

M.Sc. Márcio Palheta 46/94

Iniciar o novo emulador

Selecione o seuemulador

INICIE o seuemulador

M.Sc. Márcio Palheta 47/94

Iniciar o novo emulador

EXECUTE o seuemulador

M.Sc. Márcio Palheta 48/94

Emulador pronto para o uso

● Um booom tempo depois, o seu emulador está pronto para o uso

● Por motivos óbvios, evite encerrar o emulador

● Agora, vamos executar nossa primeira App e ver o resultado no emulador criado

M.Sc. Márcio Palheta 49/94

Configuração de deploy

● Clique no menu Run / Run Configurations...

● Clique com botão direito em Android Application / New

● Informe um nome para a configuração: HelloWorld

● Selecione o nosso projeto, clicando no botão Browser

● Clique no botão Apply para salvar as configurações

● Clique no botão Run para executar a App no Virtual Device (vulgo Emulador)

● A seguir, veremos como fica a tela de configurações

M.Sc. Márcio Palheta 50/94

Configurando a execução da App

M.Sc. Márcio Palheta 51/94

Inclusão de serviço de LOG

● Na primeira execução da App, o ADT pergunta se você deseja usar o sistema de logs chamado Logcat

M.Sc. Márcio Palheta 52/94

App rodando no Emulador

M.Sc. Márcio Palheta 53/94

Fundamentos de Android

Código fonteJAVA (.java)

Compilador(javac)

BytecodeJAVA (.class)

Empacota(.jar)

JAVAVM

PROJETOS JAVA

M.Sc. Márcio Palheta 54/94

Fundamentos de Android

Código fonteJAVA (.java)

Compilador(javac)

BytecodeJAVA (.class)

Empacota(.jar)

JAVAVM

PROJETOS JAVA

Código fonteJAVA (.java)

Compilador(javac)

BytecodeJAVA (.class)

Empacota(.dex)

DALVIKVM

PROJETOS ANDROID

M.Sc. Márcio Palheta 55/94

Fundamentos de Android - Estrutura

M.Sc. Márcio Palheta 56/94

Ciclo de vida - Activity

M.Sc. Márcio Palheta 57/94

Ciclo de vida - ActivityChamado quando a Appé criada. Usado para

criação da view e acessoa componentes.

M.Sc. Márcio Palheta 58/94

Ciclo de vida - ActivityChamado quando a Appé criada. Usado para

criação da view e acessoa componentes.

Chamado antes da App ficar Visível na tela. Se der tudo certo, chama onResume(), senão,

onStop().

M.Sc. Márcio Palheta 59/94

Ciclo de vida - ActivityChamado quando a Appé criada. Usado para

criação da view e acessoa componentes.

Chamado antes da App ficar Visível na tela. Se der tudo certo, chama onResume(), senão,

onStop().

Chamado quando a App está em 1o plano, ondeocorre interação com o

usuário.

M.Sc. Márcio Palheta 60/94

Ciclo de vida - Activity

Ocorre quando o Android chama outra atividade.

A nossa App perde o direito à tela.

M.Sc. Márcio Palheta 61/94

Ciclo de vida - Activity

Ocorre quando o Android chama outra atividade.

A nossa App perde o direito à tela. Ocorre quando outra

atividade obteve o 1oplano ou quando a Appestá sendo eliminada.

M.Sc. Márcio Palheta 62/94

Ciclo de vida - Activity

Ocorre quando o Android chama outra atividade.

A nossa App perde o direito à tela. Ocorre quando outra

atividade obteve o 1oplano ou quando a Appestá sendo eliminada.Última chance da App

executar algo. Ocorre porque o Android precisade recursos, ou usuário

finalizou a App

M.Sc. Márcio Palheta 63/94

Exercício 02: Teste de eventos

● Vamos alterar nossa classe OlaMundoActivity para incluir mensagens de log, lançadas a cada evento do ciclo de vida da Activity

● Que tal usarmos o famoso sysout ? Nem pensar. :-)

● Vamos usar o LogCat

● Para isso, basta usarmos o comando:

– Log.i(“GrupoDeMensagens”, “Mensagem”)● Inclua mensagens em todos os métodos de eventos,

conforme exemplo a seguir

M.Sc. Márcio Palheta 64/94

Exercício 02: Teste de eventos

M.Sc. Márcio Palheta 65/94

Componentes de tela

● As telas em Android são feitas em arquivos XML

● Telas ficam em: /res/layouts

● Componentes declados no XML são tratados como componentes java, filhos de android.view.View

● Podemos agrupa-losem ViewGroup's filhas de View

M.Sc. Márcio Palheta 66/94

Novos componentes de tela

● Vamos melhorar nossa interface, alterando o layout para LinearLayout e incluindo:

– Um campo de texto para receber o nome do usuário

– Um botão que, após o clique, exibe uma mensagem de boas vindas.

M.Sc. Márcio Palheta 67/94

Exercício 03: Inclusão de Strings

● Altere o arquivo /res/values/strings.xml

M.Sc. Márcio Palheta 68/94

Exercício 03: Inclusão de Strings

● Altere o arquivo /res/values/strings.xml

Novas chaves:nome e clique

M.Sc. Márcio Palheta 69/94

Exercício 03: Mudanças na tela

● Arquivo: /res/layout/olamundolayout.xml

M.Sc. Márcio Palheta 70/94

Exercício 03: Mudanças na tela

● Arquivo: /res/layout/olamundolayout.xml

Novo layoutda nossa APP,

usando LinearLayout

M.Sc. Márcio Palheta 71/94

Exercício 03: Mudanças na tela

● Arquivo: /res/layout/olamundolayout.xml

Componente TextView

para exibir título

M.Sc. Márcio Palheta 72/94

Exercício 03: Mudanças na tela

● Arquivo: /res/layout/olamundolayout.xml

Componente TextView

para exibir título

Define que o ID do componente é

igual a tvHello

M.Sc. Márcio Palheta 73/94

Exercício 03: Mudanças na tela

● Arquivo: /res/layout/olamundolayout.xml Componente texto chamado id = edNome

M.Sc. Márcio Palheta 74/94

Exercício 03: Mudanças na tela

● Arquivo: /res/layout/olamundolayout.xml

Componente botão chamado

id = btExibir

M.Sc. Márcio Palheta 75/94

Na estrada, até aqui...

● Alteramos a view (olamundolayout.xml), para inclusão de dois componentes:

– Um EditText que representa um campo de texto que recebe um texto digitado pelo usuário

– E um Button que representa um botão. Após o evento de clique do botão, o sistema deve exibir uma mensagem de boas vindas.

● Agora, precisamos alterar a classe controller (OlaMundoActivity.java), para implementação da lógica de negócios da nossa app.

M.Sc. Márcio Palheta 76/94

Exercício 03: Regras de negócio

M.Sc. Márcio Palheta 77/94

Exercício 03: Regras de negócio

Atributos querepresentam

campos da tela

M.Sc. Márcio Palheta 78/94

Exercício 03: Regras de negócio

Busca campos da tela por ID

M.Sc. Márcio Palheta 79/94

Exercício 03: Regras de negócio

Criação do Listener para o

Evento de cliquedo botão

M.Sc. Márcio Palheta 80/94

Exercício 03: Regras de negócio

Criação do Listener para o

Evento de cliquedo botão

Método invocado após o clique

do botão

M.Sc. Márcio Palheta 81/94

Execução da App em um device

● Conect o cabo de dados de um device (tablet ou celular)

● Acione o menu Run / Run Configurations

M.Sc. Márcio Palheta 82/94

Execução da App em um device

● Conect o cabo de dados de um device (tablet ou celular)

● Acione o menu Run / Run ConfigurationsNa aba Target,

selecione a opçãoAlways prompt..

M.Sc. Márcio Palheta 83/94

Execução da App em um device

● Conect o cabo de dados de um device (tablet ou celular)

● Acione o menu Run / Run ConfigurationsNa aba Target,

selecione a opçãoAlways prompt..

Execute a app

M.Sc. Márcio Palheta 84/94

Executando a App em um device

● Escolha o device onde você quer rodar sua app

M.Sc. Márcio Palheta 85/94

Executando a App em um device

● Escolha o device onde você quer rodar sua appEscolha o device

M.Sc. Márcio Palheta 86/94

Executando a App em um device

● Escolha o device onde você quer rodar sua appEscolha o device

Clique em OK

M.Sc. Márcio Palheta 87/94

App rodando no device

Device Galaxy S2

M.Sc. Márcio Palheta 88/94

App rodando no device

Device Galaxy S2 Virtual Device

M.Sc. Márcio Palheta 89/94

Alertas e confirmações

● No desenvolvimento de aplicações, é comum o uso de telas de Alerta e Confirmação

● Para essa finalidade, em Android utilizamos a classe android.app.AlertDialog

● A classe estática android.app.AlertDialog.Builder é usada construção do componente, e atualização da tela

● No exercício a seguir, criaremos um novo botão na tela principal e, quando clicado, será exibida uma tela de alerta

M.Sc. Márcio Palheta 90/94

Exercício 04: Exibir tela de Alerta

● Tela atualizada ● /res/values/strings.xml

● /res/layout/olamundolayout.xml

M.Sc. Márcio Palheta 91/94

Exercício 04: Exibir tela de Alerta

M.Sc. Márcio Palheta 92/94

O que vem a seguir?

● Cadastro de Alunos

● Tela de cadastro

● Persistência com SQLite

● Intents

● Câmera e arquivos

● LayoutInflater

● Serviços de background

● Integração via JSON

M.Sc. Márcio Palheta 93/94

Referências

● www.caelum.com.br● d.android.com● LECHETA, Ricardo. Google Android, 3a edição,

Novatec, São Paulo, 2013● Código fonte completo:

https://github.com/marciopalheta/cursosandroid

Android Básico – Hello World!