1) O documento apresenta informações sobre o desenvolvimento de aplicativos para Android, incluindo a plataforma Android, o Google App Inventor e um exemplo de aplicação. 2) O Google App Inventor é uma ferramenta que permite a criação de aplicativos para Android sem programação, através de uma interface visual com componentes arrastáveis. 3) A aplicação de exemplo mostrada é o "Miado do Gato", que reproduz o som de um miado ao se tocar na tela.

1. Desenvolvendo Aplicações em Android
Esta apostila é uma coletânea de páginas da internet testadas e analisadas.
Prof. Antonio Sérgio Nogueira
Veja em: http://www.thecodebakers.org/p/licao-1-desenvolvimento-para-android.html
http://www.tecmundo.com.br/google/11458-google-app-inventor-o-criador-de-apps-para-
android-para-quem-nao-sabe-programar.htm
http://www.appinventor.org
http://escoladerobotica.ipcb.pt/
Sumário
1. Plataforma Android..................................................................3
2. Google App Inventor.........................................................................6
3. Aplicação Miado do Gato.................................................................12

2. 1. Plataforma Android
A plataforma Android é baseada em sistema operacional Linux, adaptada para
funcionamento em dispositivos móveis, como: smart phones, PDAs e Tablets.
Para o desenvolvimento de aplicativos, foi disponibilizada uma máquina virtual Dalvik,
especialmente otimizada para uso em dispositivos móveis, além de um ambiente de
programação completo, com componentes visuais, de acesso a dados e redes.
Interessante notar é que a máquina virtual Dalvik é um projeto Open Source
(http://code.google.com/p/dalvik/), e NÃO É UMA MÁQUINA VIRTUAL JAVA ® ! Isso
mesmo: DALVIK NÃO É JAVA! Existe uma aplicação, chamada “dx”, que pode converter o
bytecode compilado a partir da máquina virtual Java (especificação da Oracle), no bytecode
da Dalvik. A Google disponibilizou um ambiente de programação baseado em Java®, que
permite o desenvolvimento de aplicações para a plataforma Android. Ele possui emuladores
de dispositivos Android e conversores de bytecode.
Arquitetura do ambiente Android
A arquitetura do ambiente de desenvolvimento Android é dividida em camadas. Sua
aplicação roda na camada superior, por exemplo: contatos, telefone, jogos, calendário, seu
programa etc. Abaixo desta camada, vem um framework de componentes, que formam uma
API de gerenciamento e serviços para uso das aplicações.
Abaixo da camada de framework, temos as bibliotecas de serviços, como OpenGL e
SQLite, e as bibliotecas principais do ambiente, além da própria máquina virtual Dalvik.
Finalmente, abaixo de tudo, temos o Kernel Linux. Embora seja possível, devido a
grande diversidade de dispositivos, não é recomendado programar aplicações em C/C++. O
ambiente de programação Android fornece tudo o que você necessita para criar aplicações
sinistras! Você não precisa programar em C/C++ ou usar chamadas ao Kernel. Tudo o que
necessita para criar aplicações Android, é do SDK e de um ambiente de programação Java.
Cada aplicação Android é executada por uma instâncla da máquina virtual Dalvik,
rodando em um processo separado dentro do sistema operacional.
Componentes
Uma aplicação Android é um conjunto de componentes, que podem ser:
 Activities – atividades ou telas;
 Services – serviços em background;
 Content Providers – disponibilizadores de dados;
 Broadcast Receivers – receptores de avisos gerais do sistema;
Uma aplicação Android é orientada a eventos. Um evento é um sinal, que pode ter sido
originado pelo usuário (um toque) ou não (o timer, o bloqueio de tela etc). Logo uma
aplicação é dividida em diversos tipos de componentes (activities, services etc) encapsuladas
em um pacote ( a aplicação). Os tipos de componentes são declarados e implementados na
camada “framework”, e você os estende para criar seus componentes específicos.
View e ViewGroups
Uma View é um elemento de interface. Comparando com uma página HTML, seriam
os elementos de formulário, como: botões, caixa de texto, radio buttons etc. As Views podem
gerar e receber Eventos, que podem ser interceptados no código-fonte. As Views podem ser
agrupadas em ViewGroups, que fornecem o layout de arrumação na tela. Existem Views
fornecidas pelo framework, que já agregam a parte visual e algum tipo de comportamento.
São chamadas de “Widgets”. Se a sua aplicação possuir algum tipo de interface visual, o que é
o caso para a maioria delas, então conterá algumas Telas (activities), com Layouts
(ViewGroups) e Views arrumadas nelas. É através das Views que você e o usuário se
comunicam.
Activity
Uma Activity é uma tela onde o usuário pode fazer algo. Note que o relacionamento
entre Activity e caso de uso não é 1 para 1. Um caso de uso pode envolver várias activities.
Para criar uma Activity é necessário criar um arquivo de layout, que contém um
ViewGroup e um ou mais ViewGroups ou Views internos, todos arrumados de acordo com a
usabilidade da sua aplicação. Depois, é necessário criar a subclasse de Activity, que será
invocada quando o usuário solicitar. A parte de código é quem comanda o espetáculo, usando
a parte de layout. Todos os eventos gerados pelas Views do Layout, e pelos controles do
aparelho (botão de “menu”, “menu de contexto” e botão “back”) poderão ser tratados no
código de sua activity. Uma activity pode iniciar outros componentes de sua aplicação, como:
outras Activities, Services etc;
Service
http://developer.android.com/guide/topics/fundamentals/services.html
Um componente que executa operações de longo prazo e em background;
Podemos iniciar um service em outro componente. Ele continuará a executar mesmo que o
usuário mude de aplicação. Outros componentes podem se conectar com o nosso service.

3. Exemplos: I/O, serviços de rede, de GPS, de alerta etc.
Imagine uma aplicação de vendas. Os vendedores recebem atualizações de Clientes e
as acessam através da sua aplicação, o download automático de atualizações poderia ser feito
por um Service de sua aplicação. Um service, uma instância de: android.app.Service, fica
rodando em Background e pode executar tarefas longas, repetitivas ou a intervalos
determinados. E também pode ser acessado por outras aplicações. Um Media Player, por
exemplo, utiliza um Service, que fica tocando a música mesmo que a interface do media
player seja fechada. Sua aplicação pode criar seus próprios Services ou usar Services
fornecidos por outros.
Content Provider
http://developer.android.com/guide/topics/providers/content-providers.html
Armazenam e recuperam dados, disponibilizando-os para outras aplicações.
Exemplos: Contacts, Agenda etc. Você também pode criar Content Providers para outras
aplicações. O Android vem com vários Content Providers, como por exemplo as informações
de contato. Você pode obter a lista de contatos do usuário (desde que autorizado por ele),
acrescentar, remover etc. Você não precisa criar um Content Provider para lidar com os dados
de sua aplicação, mas, se quiser compartilhá-los, então terá que pensar nisto. Como as
aplicações Android são muito relacionadas com “MashUps”(aplicação que usa conteúdo de
um outro site- ex: inserir mapas na sua aplicação), é bom pensar em compartilhar os dados de
suas aplicações, tornando-as mais populares.
Broadcast Receiver
http://developer.android.com/reference/android/content/BroadcastReceiver.html
Classe que recebe alertas gerais do sistema. Podem ser gerados pelas activities ou não.
Exemplo: SCREEN_OFF – gerado pelo sistema quando a tela é bloqueada. Você pode tomar
atitudes de acordo com o tipo de alerta recebido.
Um Broadcast Receiver (derivado de: android.content.BroadcastReceiver) segue o
padrão GoF “Observer”. Ele se registra e fica observando se determinado evento geral
acontece. É diferente da classe de uma Activity, que somente observa eventos gerados pelas
suas Views. Este tipo de componente pode receber eventos gerados pelo código de sua
aplicação, de outras aplicações ou mesmo do sistema Android. Quando a tela é desligada, por
exemplo, é possível tomar algumas atitudes.
2. Google App Inventor: o criador de apps para Android para quem
não sabe programar
Criado originalmente no Google Labs, mas atualmente pertence ao MIT Labs, do
Massachussets Institute of Technology, USA, o código do App Inventor é aberto, e qualquer
pessoa pode criar um ambiente de desenvolvimento dele derivado. Ambientes de
desenvolvimento como o App Inventor constituem-se em uma modalidade recente para
desenvolvimento de aplicativos voltados para sistemas móveis. Como todo usuário de
smartphone sonha em ter um aplicativo que faça exatamente o que ele quer, o App Inventor
tem esta proposta. Uma interface visual para permitir que qualquer um possa programar seus
próprios aplicativos, mesmo sem saber construir linhas de código e compilar programas de
qualquer forma. A solução é chamada App Inventor: http://ai2.appinventor.mit.edu
MIT App Inventor
A ferramenta mais fácil de utilizar para que alguém com mínimo conhecimento de
programação possa criar uma aplicação é o MIT "App Inventor".
Esta ferramenta, faculta um editor de interface gráfico através do simples "arrasto" de
componentes, como é o caso de botões, labels, recursos, listas, etc...
Para utilizadores mais avançados, tem ainda um editor de blocos pré-programados que
permitem executar tarefas, sem ser necessário criar um código escrito.
Utilização da ferramenta “MIT App Inventor 2″
A ferramenta "MIT App Inventor 2", é uma plataforma utilizada via navegador de internet.
Atenção que tem apenas suporte para o "Firefox" e "Chrome". Recomendo o Chrome que
apresenta menos erros. Para iniciar a sua utilização devemos ter uma conta no gmail e entrar
no site do mit com esta conta. http://ai2.appinventor.mit.edu/ conta gmail:
siuniesp2013@gmail.com senha: (será dada no dia), nesta conta temos armazenados os
nossos projetos (cloud computing).
É necessário ainda instalar em nosso celular ou tablet o software de emulação MIT App
Inventor 2 (disponível no google play).
Tela e Blocos
Ao iniciar um projeto uma tela será mostrada, e é nesta tela que desenharemos a nossa
aplicação, colocando textos, figuras, gráficos e outros componentes como máquina fotográfica
etc.. A partir da definição de nossa tela poderemos então entrar na tela de blocos, os blocos
são parecidos com um puzzle, encaixando uns nos outros criaremos um conjunto de regras e
operações, ou seja, nossa aplicação.
Entre na tela principal em project e depois em start new project e dê um nome ao
projeto e vamos trabalhar. Observe que do lado direito temos dois botões: Designer e Blocks
(Tela e Blocos).

4. As 4 colunas da tela
O Designer é a tela inicial de um projeto. É aqui que você desenha seu aplicativo,
escolhendo a posição dos botões e imagens, inserindo fotos, droplists, checkboxes e outros
componentes disponíveis para a construção de um programa. Ele é dividido em quatro
colunas.
Paleta
A primeira coluna, chamada de “Palette” (Paleta),é onde ficam todos os componentes
utilizáveis num aplicativo. Esta paleta é dividida em seções para facilitar a localização dos
componentes, que vão dos básicos (botões, imagens e textos) até uma seção exclusiva para
integração com ferramentas de Lego Mindstorms (uma divisão daquela brincadeira de montar
pecinhas que adiciona sensores, motores e processadores aos robôs construídos). Para utilizar
um desses componentes basta clicar sobre ele e arrastar para cima da segunda coluna,
chamada “Viewer” (Visualizador).
Visualizador
Na coluna “Viewer, o usuário pode organizar cada um de seus objetos, montando o
aplicativo como ele deve ser. Uma janela de exibição simula a tela de um smartphone com o
sistema operacional Android, apresentando uma versão próxima da final ao programador, à
medida que ele organiza o espaço de uso do programa.
Todos os itens adicionados da “Palette” ao “Viewer” são apresentados na terceira coluna,
chamada de “Components” (Componentes).
Download the App Inventor software
App Inventor é uma ferramenta tipo cloud mas requere algum download no seu computador.
 In App Inventor, Click no item Learn , então no Setup link, e faça a configuração do
seu computador.
 Se você não tiver java, você deve instalá-lo e então siga as instruções só Setup para o
tipo de computador que você tem e então você está pronto.
Crie um novo project, abrindo do blocks editor
 Volte no App Inventor (beta.appinventor.mit.edu in your browser) escolha o botão
New na esquerda e crie o new project. Entre com o nome do projeto. Ele abrirá o
Component Designer. Aqui você verá como fica sua aplicação
 No Component Designer, click em Open Blocks Editor. Um caixa de diálogo
perfuntará se você quer abrir ou salvar um arquivo chamado
appinventorForAndroidCodeblocks.jnlp. Se a opção for aberto com o Java Web Start,
perfeito, o processo toma alguns minutos para download e você verá ele aparecer.
 Se não houver a pergunta de abrir Java Web Start, você precisa provavelmente
configurar seu sitema java, volte em Learn | Setup screen.
 O blocks editor é o local onde você programará o comportamento de sua aplicação,
isto acontecerá quando você clicar um botão.

Abrindo o emulador
Uma vez que o blocks editor foi aberto com sucesso, click em New Emulator. Click OK na
caixa de diálogo que aparece e em minutos a tela do emulador aparece( uma tela de telefone).
Agora você está pronto para começar
A maioria das pessoas começam com a aplicação Hello Purr, uma aplicação que ao tocar no
telefone( ou no emulador) ocasiona o miado de um gato.
Veja aplicação em:
http://www.appinventor.org/hellopurr
O App Inventor Designer

5. Tela inicial dos projetos do Google App Inventor. (Fonte da imagem: Reprodução/Google)
O Designer é a tela inicial de um projeto. É aqui que você desenha seu aplicativo, escolhendo
a posição dos botões e imagens, inserindo fotos, droplists, checkboxes e outros componentes
disponíveis para a construção de um programa. Ele é dividido em quatro colunas.
Paleta
A primeira coluna, chamada de “Palette” (Paleta),é onde ficam todos os componentes
utilizáveis num aplicativo. Esta paleta é dividida em seções para facilitar a localização dos
componentes, que vão dos básicos (botões, imagens e textos) até uma seção exclusiva para
integração com ferramentas de Lego Mindstorms (uma divisão daquela brincadeira de montar
pecinhas que adiciona sensores, motores e processadores aos robôs construídos).
Para utilizar um desses componentes basta clicar sobre ele e arrastar para cima da segunda
coluna, chamada “Viewer” (Visualizador).
Visualizador
Na coluna “Viewer, o usuário pode organizar cada um de seus objetos, montando o aplicativo
como ele deve ser. Uma janela de exibição simula a tela de um smartphone com o sistema
operacional Android, apresentando uma versão próxima da final ao programador, à medida
que ele organiza o espaço de uso do programa.
Todos os itens adicionados da “Palette” ao “Viewer” são apresentados na terceira coluna,
chamada de “Components” (Componentes).
Componentes
Na coluna de componentes, ficam armazenados todos os itens adicionados, sejam eles visíveis
ou não na tela do programa. Dessa forma, fica muito mais simples selecionar cada objeto, pois
eles estão listados de forma ordenada e acessível.
Aqui também é possível renomear cada item. Assim, você pode chamar os componentes por
nomes que façam sentido para o seu projeto. É muito mais fácil encontrar cada coisa se você
mesmo criar um nome específico para ela, como “botão de som” em vez de “Button1”.
É possível também inserir arquivos de mídia pela terceira coluna. Clicando no botão
“Adicionar” (Add) você importa sons, fotos e vídeos do seu computador para o servidor do
App Inventor, e eles ficam disponíveis para que você possa usar no projeto.
Clicar sobre qualquer um dos itens da lista na coluna “Components” permite que você possa
editar seus detalhes na quarta coluna, chamada de “Properties” (Propriedades).
Propriedades
Esta é a coluna mais importante do App Inventor Designer, já que aqui você pode definir os
tamanhos e conteúdos dos textos de botões e caixas de informação, tamanho das imagens,
cores de fundo e largura e altura de objetos. Essas e muitas outras configurações são aplicadas
instantaneamente na tela da coluna “Viewer”, permitindo que você tenha sempre uma ótima
ideia de onde e o que está mudando em seu programa.
Uma vez que seu programa esteja parcialmente montado, é hora de começar a atribuir funções
a cada um dos componentes que você selecionou. Para isso é preciso clicar no botão “Blocks”
(Editor de Blocos), que o levará para uma nova tela.
O Editor de Blocos permite programar de forma simples. (Fonte da imagem:
Reprodução/Google)
Após configurar o computador, você pode começar a fazer a mágica da programação.
Acessando o “Blocks Editor” você pode começar a associar ações para cada item do seu
programa. Usando uma interface simples e intuitiva, a construção do aplicativo parece muito
com montar um quebra-cabeça.
O menu na lateral esquerda fornece duas abas de comandos: “Built-in” (Internos) e “My
Blocks” (Meus Blocos). Todos os objetos que você inseriu em seu programa terão comandos
de início na aba “My Blocks”, ao passo que os comandos de execução estão localizados na
aba “Built-In”. A combinação de um ou mais comando de “My Blocks” e comandos “Built-
In” forma uma ação completa. E para facilitar a construção das ações, os comandos são
estruturados como peças de quebra-cabeças. Apenas funções compatíveis se encaixam.

9. Banco de dados WEB
config.php
<?php
define('BD_USER', 'argosmov_app');
define('BD_PASS', 'sergio25');
define('BD_NAME', 'argosmov_loja');
mysql_connect('localhost', BD_USER, BD_PASS);
mysql_select_db(BD_NAME) or die('Erro conexao');
?>
cadastrar.php
<?php
include "config.php";
$chave = trim($_POST['chave']);
$dado = trim($_POST['dado']);
$query = "DELETE FROM app where chave='$chave'" or die(mysql_error());
$resultado = mysql_query($query);
$query= "INSERT INTO app (chave, dado) VALUES ('$chave', '$dado')" or
die( mysql_error());
$sql = mysql_query($query);
if ($sql=='1'){
echo 'Cadastrado';
}
else{
echo $sql;
}
?>
pesquisar.php
<?php
include "config.php";
/*$chave="1";*/
$chave = trim($_POST['chave']);
$dado1=trim($_POST['dado']);
$query = "SELECT dado FROM app where chave='$chave'" or die(mysql_error());
$resultado = mysql_query($query);
$linha = mysql_fetch_array($resultado);
$dado1=$linha['dado'];

10. if (trim($dado1)==""){
$dado1="Sem Aviso!";}
echo $dado1;
?>