Introdução ao AppInventor

Referências • Livro: David, W., Abelson, H., Spertus, E., & Looney, L. (2011).

App Inventor: Create Your Own Android Apps. – https://pdfs.semanticscholar.org/dba4/b9756b3717528b5baaf242

3cc8b09912215b.pdf

• Materiais que acompanham o livro:

http://www.appinventor.org/bookFiles • AppInventor: http://ai2.appinventor.mit.edu

Primeiro App

O primeiro aplicativo será o “HelloPurr”. Ele contém a imagem de um gato que mia quando você toca ele, e ronrona quando você chacoalha o dispositivo.

https://appinventor.mit.edu/

https://appinventor.mit.edu/

Faça login com sua conta do Google

Lista de Projetos. O App Inventor é uma ferramenta de computação

em nuvem, o que significa que seu aplicativo é armazenado em um servidor online enquanto você trabalha. Portanto, se você fechar o App Inventor, seu aplicativo estará lá quando você

retornar.

Digite o nome do Projeto e clique OK.

Depois de fazer isso, o projeto será

adicionado à lista, e a interface de

desenvolvimento será aberta.

O ambiente do AppInventor O ambiente de programação do App Inventor possui três partes principais: • O designer de componentes (Component Designer). Você o usa para

selecionar componentes para seu aplicativo e especificar suas propriedades. • O editor de blocos (Blocks Editor). Você o usa para especificar como os

componentes se comportarão (por exemplo, o que acontece quando um usuário clica em um botão).

• Um dispositivo Android com o qual você pode realmente executar e testar seu aplicativo enquanto o desenvolve. Se você não tiver um dispositivo Android à mão, poderá testar os aplicativos criados usando o emulador Android aiStarter: • https://appinventor.mit.edu/explore/ai2/setup-emulator.html.

Designer de Componentes

Editor de Blocos

Visualizador (Viewer)

Paleta (Pallete)

Componentes usados no

Projeto

Mídias (sons e imagens) usadas no

projeto

Propriedades dos componentes.

Quando você clica em um componente no Visualizador, verá as propriedades listadas aqui. Propriedades são detalhes sobre cada componente que você pode alterar. Por exemplo, ao clicar em um componente Label, você poderá ver propriedades relacionadas a cor, texto, fonte e assim por diante. No momento, ele mostra as propriedades da tela, que incluem uma cor de fundo, uma imagem de fundo e um título.

Componentes • São os elementos que você combina para criar aplicativos,

– como ingredientes em uma receita. • Alguns componentes são muito simples:

– Componente legenda: mostra o texto na tela – Componente botão: você toca para iniciar uma ação.

• Outros componentes são mais elaborados: – Componente pintura: pode conter imagens estáticas ou animações. – Componente acelerômetro: é um sensor de movimento que detecta

quando você move ou sacode o dispositivo. • Existem componentes que produzem ou enviam mensagens de

texto, tocam músicas e vídeos, obtêm informações de sites e assim por diante.

Desenvolvimento do Aplicativo