App Inventor: Introducao: mudanças entre as edições

De Wiki Cursos IFPR Foz
Ir para navegaçãoIr para pesquisar
Linha 26: Linha 26:


;Passo a passo:
;Passo a passo:
#Baixar os arquivos disponíveis na página [https://appinventor.mit.edu/explore/ai2/hello-codi.html Hello Codi]:
#Baixar os '''arquivos auxiliares''' disponíveis na página [https://appinventor.mit.edu/explore/ai2/hello-codi.html Hello Codi]:
#*Figura: codi.jpg (Clique botão direito e salve)
#*Figura: codi.jpg (Clique botão direito e salve)
#*Som: Bee-Sound.mp3 (Clique botão direito e salve)
#*Som: Bee-Sound.mp3 (Clique botão direito e salve)
Linha 32: Linha 32:
#*Botão
#*Botão
#*Legenda
#*Legenda
#Configuração do botão:
#Configuração do '''botão''':
#*Apague o texto da legenda do botão
#*Apague o texto da legenda do botão
#*Escolha como imagem para o botão a figura codi.jpg
#*Escolha como imagem para o botão a figura codi.jpg
#Configuração da legenda:
#Configuração da '''legenda''':
#*Escreve na legenda "Clique na abelhinha"
#*Escreve na legenda "Clique na abelhinha"
#Inclusão do som, que é um componente não visível.
#Inclusão do '''som''', que é um componente não visível:
#*Incluir o arquivo com o som Bee-Sound.mp3
#Na seção '''Blocos''' do App Inventor, vamos programar ações para os componentes:
#Na seção '''Blocos''' do App Inventor, vamos programar ações para os componentes:
#*Quando Botão.clique fazer
#*Quando Botão.clique fazer
#*Tocar som
#*Tocar som
#


==Referências==
==Referências==

Edição das 17h17min de 7 de novembro de 2023

Introdução ao App Inventor

O App Inventor[1] é um ambiente de programação, desenvolvido no MIT, que permite a qualquer pessoa desenvolver aplicativos para smartphones e tablets.

Acessando o ambiente de programação do App Inventor

A programação utilizando o App Inventor é realizada de forma online a partir do link App Inventor e necessita que o usuário realize um cadastro com uma conta de e-mail do gmail.

Uma vez iniciado um novo projeto, o ambiente de programação do App Inventor apresenta duas área de trabalho:

  • Designer: utilizada para projetar a interface do aplicativo, e permite incluir elementos como a tela de fundo, botões, caixas de seleção, legendas etc;
  • Blocos: utilizada para construir a lógica de programação do sistema, podendo incluir estruturas de controle, funções lógicas e matemáticas e outras.

Acessando a aplicação desenvolvida no smartphone

Para testar ou instalar uma aplicação desenvolvida com o App Inventor em um smartphone é necessário instalar o aplicativo MIT AI2 Companion disponível no Google Play Store para dispositivos Android (também disponível para iOS).

Teste de uma aplicação
No ambiente de programação pode-se utilizar a opção Conectar/Assistente AI, a qual vai gerar um QR code que deve ser lido pelo aplicativo MIT AI2 Companion.
Instalação de uma aplicação
No ambiente de programação deve-se utilizar a opção Compilar, a qual vai gerar um QR code que deve ser lido pelo aplicativo MIT AI2 Companion.
A opção de Compilar também permite gerar um arquivo com a extensão .apk para posteriormente instalada no smartphone.

Exemplo de aplicação

Hello Codi
Vamos utilizar como exemplo a aplicação Hello Codi, apresentada nos tutoriais da App Inventor.

Primeiro devemos configurar o Design da tela, depois devemos programar os Blocos de execução ao aplicativo.

Passo a passo
  1. Baixar os arquivos auxiliares disponíveis na página Hello Codi:
    • Figura: codi.jpg (Clique botão direito e salve)
    • Som: Bee-Sound.mp3 (Clique botão direito e salve)
  2. Na seção Design do App Inventor, adicione os componentes:
    • Botão
    • Legenda
  3. Configuração do botão:
    • Apague o texto da legenda do botão
    • Escolha como imagem para o botão a figura codi.jpg
  4. Configuração da legenda:
    • Escreve na legenda "Clique na abelhinha"
  5. Inclusão do som, que é um componente não visível:
    • Incluir o arquivo com o som Bee-Sound.mp3
  6. Na seção Blocos do App Inventor, vamos programar ações para os componentes:
    • Quando Botão.clique fazer
    • Tocar som

Referências


Evandro.cantu (discussão) 20h23min de 6 de novembro de 2023 (UTC)