Prof. Fernando R.

Alves – Matemática

Introdução a programação de aplicativos para Android usando o MIT App Inventor2.

Aula 1: Apresentação, introdução, criar um app com uma tela (boas vindas),
uma legenda e dois botões.

0°_ Baixe o aplicativo MIT app inventor 2 no Google Play.

1°_ Acesse o site www.appinventor.mit.edu e faça login com uma conta do Google ou cadastre-se.

2°_ Mude o idioma para português. Clique em começar novo projeto e escolha um nome (não use

espaço).

3°_ Aparecerá uma imagem de “tela de celular” na aba “visualizador” essa é a tela de “designer”

onde se “desenha” o que será visto pelo usuário quando utilizar o aplicativo.

4°_ A esquerda da tela principal (aba visualizador) temos a aba “paleta” onde temos os

componentes que podem ser levados para a “tela do celular”, apenas arrastando.

5°_ Arraste o primeiro item da lista “botão” para a tela do celular, arraste outro “botão” e uma

”legenda”.

6°_ Selecione o item “Screen1” e altere suas propriedades na aba “Propriedades” logo a sua

direita.

7°_ Altere o “Alinhamento horizontal” para Centro : 3, e altere o “Alinhamento vertical” para

Centro : 2.

8°_ Posicione o item ”legenda” acima dos botões, aproveite para mudar a propriedade “texto” na

aba direita, e escreva uma mensagem de boas vindas.

9°_ Selecione o botão mais acima para ser o botão de entrar no aplicativo, altere o nome dele na

aba “Componentes” em “Renomear” para “btentrar” o outro botão pode ser o botão de “sair” do

aplicativo, renomeie para “btsair”.

10°_ Na aba Propriedades em Texto, escreva a palavra que deve aparecer para o usuário no

botão de entrar e sair.

11°_ Clique na opção “Compilar” que esta na parte superior da tela mais ao centro, escolha a

opção “App (fornacer o QR code para o .apk)”.

 Prof. Fernando R. Alves – Matemática

Introdução a programação de aplicativos para Android usando o MIT App Inventor2.

Aula 2: Criar uma tela de login, e associá-la a tela de boas vindas.

1°_ Clique em “Adicionar tela”, logo acima do “Visualizador” e crie uma tela com o nome “tllogin’,

aguarde a nova tela abrir.

2°_ Volte para a tela “Screen1”, na aba “Blocos”, a esquerda, selecione o botão criado para entrar

no aplicativo, assim aparecerão os controles relacionados a ele.

3°_ Selecione entre esses blocos, o bloco “quando botão1 .Clique fazer”, que é o primeiro, e

arraste para a parte branca da tela.

4°_ Agora selecione a esquerda na aba blocos em internos o item controle, selecione o controle

“abrir outra tela nomeDaTela”.

5°_ E encaixe-o dentro de “quando botão1 .Clique fazer”.

6°_ Agora selecione a esquerda em “internos” o item “Texto”, aparecerão os controles desse item,

selecione o primeiro controle que é “ ” (aspas vazias), que é para digitar o que se quiser.

7°_ Encaixe na frente no controle “abrir outra tela nomeDaTela”, digite dentro das aspas tllogin,

que é a tela que queremos abrir quando alguém clicar no botão.

8°_ A esquerda na aba “Blocos” selecione o botão de sair criado para sair do aplicativo, assim

aparecerão os controles relacionados a ele”.

9°_ Selecione entre esses blocos, o bloco “quando botão1 .Clique fazer”, que é o primeiro, e

arraste para a parte branca da tela.

10°_ Agora selecione a esquerda na aba blocos em internos o item controle, selecione o controle

“fechar aplicação”.

11°_ E encaixe-o dentro de “ quando botão1 .Clique fazer”, agora quando alguém clicar no botão

sair o aplicativo será fechado.

12°_ Clique na opção “Compilar” que esta na parte superior da tela mais ao centro, escolha a

opção “App (fornacer o QR code para o .apk)”.

 Prof. Fernando R. Alves – Matemática

Introdução a programação de aplicativos para Android usando o MIT App Inventor2.

Aula 3: Criar tela de cadastro, botões, caixa de texto e duas caixas de senha.

1°_ Clique em “Adicionar tela”, logo acima do “Visualizador” e cria uma tela com o nome

“tlcasdastro’, aguarde a nova tela abrir.

2°_ Na aba visualizador em interface de usuário, arraste três botões para o visualizador, arraste

também uma caixa de texto e duas caixas de senha.

3°_ Selecione o item tlcadastro, na aba componente para alterar suas propriedades na aba

“Propriedades” logo a sua direita.

4°_ Altere o “Alinhamento horizontal” para Centro : 3, e altere o “Alinhamento vertical” para

Centro : 2.

5°_ Selecione o botão mais acima para ser o botão de cadastrar, altere o nome dele na aba

“Componentes” em “Renomear” para “btcadastrar”, Selecione o segundo botão e altere o nome

dele na aba “Componentes” em “Renomear” para “btrecupsenha” e o terceiro botão de “Sair”,

renomeie para “btsair”.

6°_ Na aba Propriedades em Texto, escreva a palavra que deve aparecer para o usuário nos

respectivos botões.

7°_Renomeie a caixa de texto e caixas de senha, para cxemail, cxsenha1 e cxsenha2, depois em

propriedades no item dica coloque um texto para indicação, para cxemail coloque e-mail, para

cxsenha1 coloque senha, para cxsenha2 coloque confirmar senha.

8°_ A esquerda na aba “Blocos” selecione o botão de sair criado para sair do aplicativo, assim

aparecerão os controles relacionados a ele”.

9°_ Selecione entre esses blocos, o bloco “quando botão1 .Clique fazer”, que é o primeiro, e

arraste para a parte branca da tela.

10°_ Agora selecione a esquerda na aba blocos em internos o item controle, selecione o controle

“fechar tela”.

11°_ E encaixe-o dentro de “ quando botão1 .Clique fazer”, agora quando alguém clicar no botão

sair o aplicativo será fechado.

 Prof. Fernando R. Alves – Matemática

Introdução a programação de aplicativos para Android usando o MIT App Inventor2.

Aula 4: programar os comandos para cadastro e banco de dados.

8°_ Volte para a tela “Screen1”, na aba “Blocos”, a esquerda, selecione o botão criado para entrar

no aplicativo, assim aparecerão os controles relacionados a ele.

9°_ Selecione entre esses blocos, o bloco “quando botão1 .Clique fazer”, que é o primeiro, e

arraste para a parte branca da tela.

4°_ Agora selecione a esquerda na aba blocos em internos o item controle, selecione o controle

“abrir outra tela nomeDaTela”.

5°_ E encaixe-o dentro de “quando botão1 .Clique fazer”.

6°_ Agora selecione a esquerda em “internos” o item “Texto”, aparecerão os controles desse item,

selecione o primeiro controle que é “ ” (aspas vazias), que é para digitar o que se quiser.

7°_ Encaixe na frente no controle “abrir outra tela nomeDaTela”, digite dentro das aspas tllogin,

que é a tela que queremos abrir quando alguém clicar no botão.

8°_ A esquerda na aba “Blocos” selecione o botão de sair criado para sair do aplicativo, assim

aparecerão os controles relacionados a ele”.

9°_ Selecione entre esses blocos, o bloco “quando botão1 .Clique fazer”, que é o primeiro, e

arraste para a parte branca da tela.

10°_ Agora selecione a esquerda na aba blocos em internos o item controle, selecione o controle

“fechar aplicação”.

11°_ E encaixe-o dentro de “ quando botão1 .Clique fazer”, agora quando alguém clicar no botão

sair o aplicativo será fechado.

12°_ Clique na opção “Compilar” que esta na parte superior da tela mais ao centro, escolha a

opção “App (fornacer o QR code para o .apk)”.