Mostrar itens de alturas diferentes numa galeria de aplicações de tela

Se itens diferentes no seu conjunto de dados contiverem diferentes quantidades de dados no mesmo campo, poderá mostrar completamente os itens que contêm mais dados sem precisar adicionar espaço em branco depois dos itens que contêm menos dados. Adicione e configure um controlo Galeria de Altura flexível para que possa:

• Configurar os controlos Etiqueta para expandir ou reduzir com base nos conteúdos neles incluídos.
• Posicione cada controlo para que seja apresentado automaticamente abaixo do controlo que se encontra imediatamente acima.

Neste tutorial, apresenta dados sobre produtos de pavimentos num controlo Galeria de Altura flexível. A imagem de cada produto é apresentada 5 pixels abaixo da descrição geral, quer a descrição geral contenha cinco linhas de texto ou duas linhas.

Sugestões de leitura

Se nunca tiver adicionado controlos a uma galeria, siga os passos em Mostrar uma lista de itens antes de prosseguir neste tópico.

Adicionar dados a uma aplicação em branco

1. Transfira este ficheiro do Excel, que contém nomes, descrições gerais e ligações para imagens de produtos de pavimentos.

   

2. Carregue o ficheiro do Excel para uma conta de armazenamento na cloud, como o OneDrive, Dropbox ou Google Drive.

3. Crie uma aplicação em branco com o esquema Telefone.

4. Adicione uma ligação à tabela FlooringEstimates no ficheiro do Excel.

   Para obter mais informações, veja Adicionar uma ligação.

Adicionar dados a uma galeria

1. No separador Inserir, clique ou toque em Galeria e, em seguida, clique ou toque em Altura flexível.

   

2. Redimensione a galeria para ocupar o ecrã inteiro.

3. Defina a propriedade Items da galeria como FlooringEstimates.

Mostrar os nomes de produtos

1. No canto superior esquerdo da galeria, clique ou toque no ícone de lápis para selecionar o modelo da galeria.

   

2. Com o modelo da galeria selecionado, adicione um controlo Etiqueta.

3. Defina a propriedade Text do controlo Etiqueta como esta expressão:
   ThisItem.Name

   

Mostrar as descrições gerais dos produtos

1. Com o modelo da galeria selecionado, adicione outro controlo Etiqueta e mova-o para baixo do primeiro controlo Etiqueta.

2. Defina a propriedade Text do segundo controlo Etiqueta como esta expressão:
   ThisItem.Overview

3. Com o segundo controlo Etiqueta selecionado, clique ou toque no ícone de etiqueta-nome no separador Conteúdo e mude o nome do controlo para OverviewText.

   

4. Defina a propriedade AutoHeight da caixa OverviewText como verdadeira.

   Este passo garante que a caixa irá aumentar ou diminuir para se ajustar ao conteúdo.

   

Mostrar as imagens dos produtos

1. Redimensione o modelo para ter o dobro da altura.

   Pode adicionar controlos ao modelo mais facilmente à medida que cria a aplicação. Esta alteração não afeta o aspeto da aplicação quando é executada.

2. Com o modelo da galeria selecionado, adicione um controlo Imagem e mova-o para baixo da caixa OverviewText.

3. Verifique se a propriedade Image do controlo Imagem está definida como esta expressão:
   ThisItem.Image

4. Defina a propriedade Y do controlo Imagem com base na posição e no tamanho da caixa OverviewText, tal como nesta expressão:
   OverviewText.Y + OverviewText.Height + 5

   

Aplique o mesmo conceito se pretender adicionar mais controlos: defina a propriedade Y de cada controlo com base nas propriedades Y e Height do controlo que está acima.

Passos seguintes

Saiba mais sobre como trabalhar com um controlo de galeria e fórmulas.