Embed Size (px)
DESCRIPTION
Guia para criar uma aplicação Android no APP Inventor do MIT
Citation preview
Programar por blocosAntes de começarmos, se nunca programou por blocos, aceda a https://blockly-games.appspot.com/puzzle e complete o puzzle...
Viu como é fácil? Vamos então criar a nossa primeira aplicação para telemóveis!
Aplicação contagem 1.0Aceda a http://ai2.appinventor.mit.edu/
Depois de fornecer a senha google deverá chegar a:
Aceda a “Projects” e escolha a opçõa “Start a new project”
Atribua um nome ao seu projeto
- 2 -
Arraste para a representação do ecrã dotelemóvel um objeto tipo “Button” e outro dotipo “Label”
Altere as propriedade do ecrã de modo a que os objetosfiquem centrados horizontal e verticalmente
Altere também a cor de fundo do ecrã para cinza claro.
Altere o tamanho da letra da Label para 80 e em TextLabel coloque um “0”
Altere o nome do botão para contagem e o texto sobre obotão para “pressione-me!”
- 3 -
Programação:
Passe para o modo de programação
Seleccione o botão “Contagem” e arraste obloco de comandos “Wen contagem.click”para a área de programação
Selecione agora a “Label1” e complete aprogramação conforme a figura ao lado.
Procure os blocos necessários em “Math”
Esta linha de programação irá somar o valor 1 ao valor que estiver representado na Label 1. Assim, cada vez que premirmos o botão estaremos a incrementar o número representado na Label 1, Vamosligar o telemóvel e testar!
Ligação do telemóvel Vamos agora ligar o telemóvel para testar a aplicação. Instale no seu telemóvel a aplicação MIT “App Inventor 2 Companion”
- 4 -
Abra a aplicação e, no computador, aceda à opção“Al Companion”
Deverá aparecer um ecrã com um QR code.
No telemóvel, escolha a opção “Scan QR Code”e aponte o telemóvel para QR code exibido nocomputador.
Em alternativa (caso o seu telemóvel não tenhamáquina fotográfica) pode escrever o código deseis dígitos escrito ao lado do código.
Se tudo correu bem deverá ter agora a aplicaçãoa correr no seu telemóvel.
Tente pressionar o botão e veja como vão surgindo sequencialmente os número na Label 1.
Leitura dos númerosPara ouvirmos ler os números representados vamos juntar umrecurso “TextToSpeepch” ao nosso projeto.
- 5 -
Volte para o modo Designer e arraste para o projetoum recurso do tipo “TextToSpeepch” queencontrará na secção “Media”.
Trata-se de um elemento não visível, pelo que ficaráno fundo do ecrã...
Passe novamente para o modo deprogramação “Blocks” .
Selecionando o objeto “TextToSpeepch”arraste o comando “call TextToSpeepch.Speak” conforme a figura e depois junte o comando “Label1.Text” que encontrará selecionando o objeto Label1.
Teste de novo o programa no telemóvel, se tudocorreu bem, deverá ouvir a contagem....
Agitar para voltar a zero...Volte ao modo “Designer” e junte o recurso“AccelorometerSensor” que ficará na zona dosrecursos não visíveis.
Passe para o modo de programação earraste os blocos seguintes.
Tente agora agitar o telefone e verifique
- 6 -
se o contador volta a zero. Caso não funcione tenteaumentar a sensibilidade do Acelerómetro naspropriedades do objeto, no modo “Designer”
Juntar outra línguaVamos agora juntar dois botões para que o programafuncione em duas línguas diferentes.
Para que os botões fiquem lado a lado utilize um objetodo tipo “HorizontalArrangement” que encontra no grupoLayout. De seguida arraste dois botões para dentro desseobjeto que deverão ficar lado a lado, como na figura.
Altere o texto do primeiro botão para Português e do segundo para Inglês.
Altere agora o nome dos botões pata “bt_pt” e “bt_ing” respectivamente e a cor de fundo
“BackgroundColor” para verde e cinza escuro, respectivamente.
Passe agora para o modo de programação e junte o código seguinte:
- 7 -
Teste agora o programa quedeverá funcionar em ambasas línguas!
Juntar a bandeira e informação para agitar para voltar a zero
No modo “Designer” junte um recurso do tipo“Image” ao seu projecto. Procure na internet imagenscorrespondentes às bandeiras de Portugal e Inglaterrae guarde-as no seu computador com os nomes“pt.jpg” e “ing.jpg” respectivamente.
Carrege as imagens para o seu projecto (BotãoUpload).
Altere o nome do objecto “image” para “Bandeira”.Altere também a sua largura “Width” e altura Height para 150 pixels. Em Picture escolha o ficheiro“pt.jpg” que já deverá estar carregado no projecto.
Passe para o modo de programação e junte os blocosseguintes:
- 8 -
Teste de novo o seuprograma...
Juntar a frase “Agitar para voltar a zero” e botão “Sair”Para que o utilizador saiba esta informação vamos criar mais uma Label com esta informação que, obviamente deverá também estar traduzida em ambas as línguas. Chamaremos a esta label “info”. Esta mensagem também será traduzida cada vez que passarmos para o funcionamento em inglês.
Podemos ainda juntar um botão “Sair”, que permita fechar a aplicação e chamaremos a este botão “sair”. Este botão não funcionará no modo emulador, mas sim quando a aplicação for corrida de modo autónomo
Depois de juntar estes dois elementos o código final ficará
- 9 -
Se tudo funcionar corretamente pode agora gravar a aplicação no seu computador num ficheiro .apk
Esse ficheiro poderá ser instalado autonomanente num telemóvel ou tablet androide!
Parabéns, criou a sua primeira aplicação!
- 10 -
