Módulo 2 – Aplicativo Android

O MIT APP INVENTOR

A plataforma utilizada para desenvolver o Aplicativo para o
Android será o MIT App Inventor, que é uma aplicação de código
aberto que foi desenvolvido pela Google e atualmente é mantida
pelo MIT (Massachusetts Institute of Technology).

O MIT App Inventor é acessado através do navegador de

internet, pelo link: ai2.appinventor.mit.edu

Após acessar, será necessário efetuar o login utilizando uma

conta Google:

1
 Feito o login, a tela inicial é aberta, onde podem ser
acessados todos os menus:

Na guia “Projetos”, você poderá acessar os seus projetos

anteriores, iniciar um novo, importar os que você salvou em seu
computador, salvá-lo e exportá-lo.

2
 Em “Conectar”, você poderá conectar o seu celular com o
projeto via Wifi* em Assistente AI ou pelo USB. Também poderá
simular um celular na aplicação, em Emulador. Caso aconteça
algum problema ou você desconecte o seu celular e queira conectá-
lo novamente, poderá reiniciar a conexão.

*Para conectar via Wifi, primeiramente você deverá ter o

Aplicativo MIT AI2 Companion em seu celular, que pode ser
baixado no Play Store.

3
 E poderá escanear ou digitar o código de 6 dígitos:

Para utilizar o Emulador ou via USB, você deverá ter em seu

computador o Software aiStarter, que pode ser baixado neste link:

http://appinventor.mit.edu/explore/ai2/setup-emulator.html

Na aba “Conectar”, você poderá baixar o seu projeto via QR

Code ou direto para o seu computador.

4
 Para começar a desenvolver, vamos clicar em “Iniciar um
novo projeto” e dar um nome ao aplicativo:

Após dar o nome ao aplicativo, vamos para a tela de

desenvolvimento.

Esta tela é dividida em duas partes principais: Designer e

Blocos.

5
 No Designer é onde faremos toda a parte da interface do
aplicativo com o usuário, como botões, imagens e textos.

Na tela de Blocos é onde faremos a programação do

Aplicativo.

6
 DESENVOLVIMENTO DO APLICATIVO
Agora vamos iniciar o desenvolvimento do Aplicativo
Bluetooth.

De início vamos carregar as imagens que serão usadas para

os botões:

Vamos adicionar 2 botões: um para conectar ao bluetooth e

outro para acender e apagar o LED. Também vamos adicionar uma
lista, que ficará invisível para o usuário.

7
 Nas Propriedades da Tela, vamos definir seu Alinhamento
Horizontal como “Centro”, a Cor de Fundo para “Preto” e desmarcar
a opção de Título Visível.

Em Propriedades do Botão 1, vamos adicionar a imagem

“bluetooth”, definir a altura e largura para 75 pixels e apagar o texto.

8
 Em Componentes, vamos alterar o nome do Botão1 para
“btn_conexao”.

Abaixo do btn_conexao, vamos adicionar uma “Legenda”,

alterar o texto para “Conectar Bluetooth” e mudar a cor do Texto
para “Branco”.

9
 Para deixar a Lista invisível vamos às Propriedades e
desmarcamos a opção “Visível”.

Agora vamos alterar o nome do Botão 2 para “btn_luz”. Em

Propriedades vamos adicionar a Imagem “lamp_off” e apagar o
texto.

10
 Para distanciar o btn_luz da legenda do botão acima, iremos
adicionar um bloco de “Organização” entre eles (este bloco não
ficará visível ao usuário, somente o seu espaçamento).

Com isso a aparência do nosso aplicativo está pronta:

11
 Ainda na Tela de Design, vamos adicionar:

 Notificador, para exibir um alerta;

 ClienteBluetooth, para fazer a conexão;
 IniciadorDeAtividade, para iniciar a ativação do
bluetooth;
 Temporizador, para receber os status do Arduino.

Nas propriedades de “ClienteBluetooth1”, vamos remover a

opção “seguro”.

12
 Nas propriedades de “IniciadorDeAtividades1”, no campo de
Ação, devemos escrever o seguinte texto:

android.bluetooth.adapter.action.REQUEST_ENABLE

Para o “Temporizador1” devemos alterar o Intervalo para 100.

13
 Após finalizar a parte do Design do nosso aplicativo, vamos
começar a desenvolver a programação dele. Para isso vamos à aba
de “Blocos” e vamos criar uma variável chamada “recebe_bluetooth”
e adicionar um texto vazio. Esta variável será responsável por
receber o que chega ao ClienteBluetooth1 para podermos analisar
esta informação.

14
 O próximo passo é, ao inicializar a Tela Inicial do Aplicativo (o
App Inventor não permite que o Bluetooth funcione em mais telas),
verificar se o bluetooth está disponível ou não. Se não estiver
ativado, irá mandar uma notificação para o usuário.

15
 Para iniciar a conexão do bluetooth, devemos criar algumas
condições para quando clicarmos no botão btn_conexão:

 Caso o bluetooth já esteja ativo e conectado, vamos

desconectar e mudar o texto da Legenda.

16
 Caso o bluetooth esteja ativo, mas não conectado,
vamos abrir a “EscolheLista1”.

 Caso o bluetooth não esteja ativo, vamos gerar uma

notificação para o usuário informando-o que deve ativá-
lo e dar a opção de Ok e Sair do aplicativo.

17
18
 Com disse anteriormente, se o Bluetooth estiver ativo, mas
não conectado, a lista será aberta quando clicarmos no botão.
Quando a lista abre ela tem dois parâmetros: AntesDeEscolher e
DepoisDeEscolher.

 AntesDeEscolher – Este parâmetro Lista os dados do

Bluetooth. Ou seja, esta lista vai receber os elementos
que já estão pareados com o seu celular.

19
 DepoisDeEscolher – Após pegar os dados escolhidos
pelo usuário temos que conectar a eles.
Se o bluetooth conectar, vamos mandar uma
mensagem ao usuário dizendo que está conectado e
mudar a legenda.

20
 Para o Arduino não ficar mandando informações o tempo todo
e somente mandar quando conectar-se ao aplicativo iremos criar
uma condição que mandará o caractere “s” e ele responderá com o
seu status atual (esta parte será vista na programação do Arduino).

Caso não seja possível conectar o Bluetooth vamos mandar

outro alerta ao usuário, informando o problema.

21
 Agora faremos o acionamento pelo botão “btn_luz”. Quando
clicarmos nele, vamos enviar o caractere “L” para o Arduino, para
que ele possa interpretá-lo e ligar a sua saída.

Para receber os dados do Arduino, vamos utilizar o

“Temporizador1”. Por segurança faremos com que ele receba só se
o Bluetooth estiver conectado, pois ele já inicia habilitado.

Se o bluetooth estiver conectado, vamos verificar se há dados

enviados por ele (via serial) e se são maiores que zero.

Caso haja dados, vamos armazená-los na variável que

criamos no início da programação.

22
 Para tratar os dados que recebemos do Arduino, vamos
analisar a informação que ele enviou e comparar com uma que
iremos pré-definir.

Caso recebermos que a luz (ou o LED) está acesa, vamos

mudar a imagem do botão para o da lâmpada acesa (lamp_on).

Caso esteja apagado, vamos utilizar a imagem “lamp_off”.

Agora o Aplicativo já está finalizado!

23