Você está na página 1de 23

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