Você está na página 1de 41

Curso:

Programação Android
App Inventor 2
O que é o App Inventor?

• Plataforma de desenvolvimento de aplicações para Smartfones e


Tabletes Android, do Instituto Tecnológico de Massachusetts (MIT).

• Open-source e TOTALMENTE GRÁTIS

• Objetivo: Democratizar o desenvolvimento de apps


Caraterísticas do App Inventor
• Simples e potente

• Programação por blocos (como no Scratch!)

• Interface gráfico do tipo drag and drop, fácil de usar

• Promove o Pensamento Computacional

• Visual e intuitivo

• Projetos alojados na cloud

• Desenvolvimento criativo!
O que é possível fazer?

• Diferentes tipos de aplicações!

• Com imaginação e criatividade podemos cria r:


• Jogos.
• Aplicações para a educação.
• Aplicações de produtividade.
• Aplicações que controlam robôs.

• E muito mais!!!!!
Publicação na Internet
Exportação o projeto de app
• Permite exportar o projeto de app:
• Formato AIA (próprio de App Inventor)
• Formato APK (executável Android)

• Pode ser descarregado no computador e/ou

• Smartfone ou Tablet Android (QR).


O que é necessário para usar o App Inventor?

• Ligação estável à internet

• Conta Gmail

• É, ainda, importante termos:


• Dispositivo Android (Smartfone e/ou Tablete)

• Ligação WIFI na mesma rede que o computador


Por onde Começar?

Browser, Conta e Registo


• Ferramenta baseada na cloud.
• Construir as app’s diretamente no web browser
(não funciona com o Internet Explorer, recomendo o Chrome, Firefox ou Safari).
• O software App Inventor, ou "serviço" está disponível no site
ai2.appinventor.mit.edu.
• Fazer o registo no site clicando em
Desenvolvimento e testes
• Desenvolver aplicações de imediato.
(A área de Designer e o Editor Blocos corre no browser.)
• Permite realizar live testings. As três opções para a configuração dos live
testings são:
• Ligação por Wi-fi na mesma rede.
(Recomendada)

• Utilização do Android Emulator.

• Ligação ao telemóvel por cabo USB.


Desenvolvimento e testes
• Enquanto desenvolve a app, pode e deve ir testando o seu funcionamento no
telemóvel ou emulador. As alterações feitas são imediatamente implementadas!
Software necessário
Encontra os links para os pacotes de software na 1ª sessão disciplina
MIT AI2 Companion
• Pacote de software que deve ser instalado no smartfone ou no tablet. Só funciona
corretamente se os dois dispositivos se encontrarem na mesma rede WiFi.
Software necessário
MIT_Appinventor_Tools_2.3.0 (~80 MB)
Pacote de software necessário para
quem utiliza o emulador ou a ligação
por cabo USB ao telemóvel Android.

Deve, após a instalação, iniciar o


software clicando no icon aiStarter
Resumindo…
Vamos começar!
Passo a passo…
1º passo: Aceder ao site ai2.appinventor.mit.edu;
2º Clique em Create apps!

3º Iniciar sessão com a


conta de e-mail do gmail.
Passo a passo…
4º passo: Clique em Allow;
Passo a passo…
5º passo: Ler e aceitar as condições do serviço;
Passo a passo…
6º passo: Clique em Take Survey Later;
Passo a passo…
7º passo: Clique em Continue;
Passo a passo…
8º passo: Clique Start new project;
Designer – Interface do utilizador
Paleta de
componentes
Encontre e arraste o
componente para sua Botão Blocks
app. Mudar para o
interface Blocks.

Viewer ou ecrã da app


Arraste os
componentes da paleta Propriedades
e veja como fica a sua Selecione um componente da
app. lista Componets e altere as
suas propriedades (cor,
tamanho, etc…).
Blocks Editor - Programação
Blocos de comandos: Encontre Blocos
que lhe permitem definir a ação que Botão Designer
pretende adicionar à sua app e arraste-os Mudar para o
para o Block Viewer. interface Designer.

Bloco de
comandos

Viewer área de trabalho


para onde são arrastados os
blocos de comandos.

Componentes adicionados à app no


Designer Viewer para os quais pode
adicionar candos específicos (programar
os componentes).
O meu primeiro programa
O meu primeiro programa
O meu primeiro programa

“Escreva o
seu nome:
O meu primeiro programa

“Clique aqui”
O meu primeiro programa

Agora vamos começar a


“programar” os nossos blocos!!

Limpar o texto
O meu primeiro programa
O meu primeiro programa
O meu primeiro programa
O meu primeiro programa
O meu primeiro programa
Vamos testar a nossa app selecionando a
opção Emulator do menu Connect.

A primeira vez que abrir o emulador, o


processo é lento, podendo demorar alguns
minutos!!!
Paciência….
Se tudo correr bem, verá o ecrã do Emulador, e da
sua aplicação em funcionamento (Não esqueça de
iniciar os serviços de aiStarter).
O meu primeiro programa
Adicionar uma saudação ao app:
O meu primeiro programa

Vamos melhorar esta app?

Próximo passo: vamos inserir um som nesta app!!!


Para isso, deve aceder à área de Designer.
O meu primeiro programa
O meu primeiro programa
O meu primeiro programa
O meu primeiro programa
Altere a sua app de forma a deixa-la assim:

Agora teste a sua app!!!!


O meu primeiro programa
Para uma melhor experiência, recomendo o uso de
um telémovel em substituição do emulador.
Para isso, clique em Reset Connection:

E depois em AI Companion no seu telémovel e


faça a leitura do QR Code. (Não esqueça
que têm que estar na mesma rede.)
O meu primeiro programa
O meu primeiro programa
Esta foi a vossa primeira app!

Os principais constrangimentos estão

ultrapassados!

Espero ter despertado o vosso


interesse e curiosidade pelo
App
Inventor.

Obrigado!

Você também pode gostar