Curso APP Inventor Brasil
APRIMORANDO NOSSA TELA DE CADASTRO – PARTE I
APP Inventor Brasil
[email protected]
Curso APP Inventor Brasil
*nota: durante o desenvolvimento do curso, a plataforma foi atualizada, surgiram algumas novidades, como por exemplo, na aba blocks agora é possível guardar blocos em uma mochila que aparece no canto superior direito da tela, entre outras mudanças. Caso seja necessário, serão comentadas no curso.
Nesta aula vamos finalizar a estrutura do nosso formulário de cadastro, e conhecer mais um componente do APP Inventor. Em muitos aplicativos você encontra um menu que ao ser selecionado abre uma lista com várias opções para serem escolhidas, são as famosas listas suspensas. Vamos usar uma lista dessas para selecionar qual a prioridade do nosso compromisso. Na aba designer, procure no palette o componente Spinner. Coloque-o na tela de cadastro acima do botão salvar.
Figura 37: Spinner
O Spinner possui poucas propriedades, as novidades são Prompt e ElementsFromString. A primeira define um título para a caixa de diálogo do menu suspenso e a segunda define as opções que sua lista terá. Nossa lista vai ter três opções: baixa, média e alta, referentes à prioridade do nosso compromisso. Coloque esses valores em ElementsFromString separando-os por virgula, conforme a figura abaixo:
Figura 38: Elementos inseridos
Agora coloque no Prompt um título, no meu coloquei prioridade. Vamos explorar um pouco os blocos
desse componente, vá para aba blocks. O spinner possui apenas um evento, o
APP Inventor Brasil
[email protected]
que
Curso APP Inventor Brasil
assim como outros que já vimos, é executado após uma opção ter sido selecionada, o selection dentro do bloco é a opção que foi selecionada. Caso você selecione a opção “baixa”, o selection terá o valor “baixa”. Vamos fazer um teste, dentro deste evento coloque os blocos necessários para quando for selecionada uma opção o texto da label do título receber a opção selecionada. Tente fazer sozinho antes de prosseguir. Existem algumas maneiras de se fazer este teste, vou mostrar usando o selection do evento
AfterSelecting, ao colocar o mouse sobre o selection aparecerão mais dois blocos: O que possui o get(pegar) captura o valor que foi selecionado, e o set (configura) atribui um valor para a opção selecionada. Como a opção já possui um valor, que foi definido na aba designer, vamos pegar esse valor e atribuí-lo ao texto da label título.
Figura 39: Bloco de teste do spinner Agora teste através do Al Companion.
Figura 40: Teste do spinner Além do evento AfterSelecting, o
componente
Spinner possui
um
método
chamado
. Ele serve para chamar a lista de opções, podemos testar este método fazendo com que quando o botão salvar for clicado ele chame a lista de opções do Spinner. Veja como fica os blocos e teste para ver o funcionamento.
APP Inventor Brasil
[email protected]
Curso APP Inventor Brasil
Figura 42: DisplayDropdown
Bom pessoal, encerramos aqui a estrutura da nossa tela de cadastro. Com relação à aparência não se preocupe, no Tópico 8 vamos modificá-la e deixar nosso aplicativo mais bonito. No próximo tópico irei apresentar alguns conceitos necessários para continuar o desenvolvimento do curso, vamos aplicar esses conceitos utilizando componentes do APP Inventor, porem precisamos entender a teoria primeiro.
APP Inventor Brasil
[email protected]
