CURSO-APP-INVENTOR-2-BASICO-TOPICO-7.pdf

Curso APP Inventor Brasil

ENVIANDO DADOS E VISUALIZANDO O COMPROMISSO

APP Inventor Brasil [email protected]


Neste tópico falaremos mais sobre abertura de telas e passagem de valores entre as mesmas. Em aulas anteriores já vimos modos mais simples de se abrir novas telas, porém agora iremos aprender como passar valores para outras telas. Agora que nossos compromissos estão sendo salvos em uma lista na variável criada na última aula, devemos transmitir seu valor (conteúdo) para a tela inicial, para que as informações nela salvas sejam exibidas na tela de visualização de compromissos. Para enviarmos os valores para a tela inicial, usaremos o bloco , da categoria Control, que fecha a tela atual passando algum valor para a próxima tela a ser aberta, no nosso caso, a tela inicial. Devemos colocar este bloco no evento .click do botão salvar, logo após os blocos que salvam as informações na lista, e o valor a ser enviado é o conteúdo da nossa variável (no meu caso: comp). Nosso bloco deve ficar assim:

Figura 50: fechamento da tela e passagem de valores Após esta ação, a tela de cadastro será fechada, e estaremos na nossa tela inicial, que armazenará o valor recebido até que outra ação seja feita, por exemplo: fechar o aplicativo ou abrir outra tela. Agora iremos transmitir o valor recebido pela tela inicial para a tela de exibição, caso você não se lembre como criar uma tela, basta ir à opção Add Screen..., no canto superior esquerdo da tela, e digitar o nome (à sua escolha) da tela a ser inserida, no meu caso coloquei compromisso. Como o valor está em nossa tela inicial, e não iremos usá-lo aqui, vamos transmiti-lo diretamente para nossa tela de compromisso por meio de uma variável, para organizar e exibir as informações sobre o compromisso cadastrado. Aqui, coloquei como nome da variável: infor. Inicialize-a com uma lista vazia. Para capturar o valor passado para esta tela, precisaremos de mais um evento, o .OtherScreenClosed, que nos permite capturar o valor passado para a tela.

Figura 51: Evento de captura da passagem de valores UBI



A nossa variável deve receber o valor de result, já mostramos em outras aulas como atribuir valores a variáveis. Os blocos internos ficarão assim:

Vá à aba blocks, e arraste o seguinte bloco: , ele também se encontra na categoria Control, e sua função é abrir uma tela passando um valor, no nosso caso, o valor que enviamos à tela inicial após fecharmos a tela de cadastro. A seção screenName receberá um bloco de texto com o nome da tela que queremos abrir, enquanto na startValue iremos incluir o valor que queremos passar para a próxima tela a ser aberta, para isso, pegue o valor da variável que recebeu o conteúdo da passagem de valores ( infor). O bloco open another screen with start value deve ser colocado no evento do botão BTN_compromisso.

Esse esquema funcionará, porém, deixa uma falha que requer atenção para ser evitada: se alguém tentar abrir a tela de visualização de compromisso sem cadastrar nenhum compromisso (por exemplo, logo após abrir o aplicativo), o que ocorrerá? Nesse caso, será passada a lista vazia, o que provavelmente causará um erro na aplicação, a menos que evitemos isso. Para isso, utilizaremos mais um conceito de programação: os testes condicionais. Testes condicionais são usados para manipular ações dentro do aplicativo, e decidir quando as mesmas devem ou não ocorrer. No nosso caso, queremos evitar a abertura da tela de visualização caso a lista que recebe as informações do compromisso (a variável infor) esteja vazia.

Para que esse controle seja feito, usaremos o bloco executada apenas quando uma condição for satisfeita.

, que permite que uma instrução seja

Queremos que a tela seja aberta apenas se a lista tiver algum dado e não estiver vazia, portanto, utilizaremos mais um bloco da categoria lists, o , que verifica se a lista está vazia. Atribua-o o valor de infor e encaixe-o no if (se). Como teremos duas condições, devemos adicionar o espaço para as instruções que serão executadas caso a lista não esteja vazia. Para isso, clique no botão azul no canto superior esquerdo do bloco, aparecerão duas opções: else if e else. No nosso caso, usaremos apenas um else, arraste-o para a estrutura if do lado direito. O bloco open another screen with start value deve ser reposicionado, colocado na seção else. Para que o usuário seja alertado quando a lista estiver vazia, podemos chamar um aviso da notifier quando o botão for clicado. Para isso, arraste o evento .ShowAlert da notifier para a seção then e exibir o seguinte aviso: “Nenhum compromisso cadastrado!”. Lembrando que o bloco if deve ficar no evento .click do botão de compromisso. Nosso bloco deve ficar assim:



Figura 52: bloco if finalizado Ao abrirmos a tela, temos todas as informações nela, basta capturá-las e exibi-las. Para isso, arraste cinco labels para sua tela de compromissos. Para melhor entendimento, elas devem ser renomeadas de acordo com a informação que irão receber. Nomes intuitivos ajudam na hora de manipular os blocos. No meu exemplo, usarei os nomes: título, descrição, data, hora e prioridade. Veremos agora como manipular conteúdos de listas. Para isso, salve o valor passado para sua tela em uma variável (no meu exemplo: dados), atribuindo à mesma o seguinte bloco: para capturar o valor de inicialização da tela.

, que serve

Agora, devemos fazer cada label receber seu respectivo item, presente na lista salva em dados. Para isso, usaremos um bloco da categoria lists que nos permite capturar itens em uma lista de acordo com suas posições (índices), o select list item; cada label receberá o item presente na lista de acordo com seu índice, como no exemplo:

Figura 53: exemplo do bloco de captura de itens O primeiro parâmetro é o nome do local (variável) onde está armazenada a lista, o segundo é o índice do item a ser capturado. Repita esse procedimento até atribuir cada um dos itens da nossa lista a uma das labels. O resultado final deverá ser:



Figura 53: Exibição dos compromissos Bom, está tudo indo como planejado, porém, o visual do nosso aplicativo ainda está o mais básico possível. No próximo tópico iremos aprender como organizá-lo para que, além de funcional, também tenha um design agradável. É isso, até a próxima ;) .


CURSO-APP-INVENTOR-2-BASICO-TOPICO-7.pdf

Recommend Documents