Mostrar uma lista de itens de qualquer fonte de dados, adicionando um controle Galeria para seu aplicativo. Este tópico usa o Excel como fonte de dados. Filtre a lista ao configurar o controle Galeria para mostrar somente os itens que correspondem ao critério de filtro em um controle de Entrada de texto.

Pré-requisitos

Adicionar um controle Galeria

  1. Abra o PowerApps e, em seguida, clique ou toque em Novo próximo à borda esquerda.

  2. No bloco Aplicativo em branco, clique ou toque em Layout do telefone.

  3. Na caixa de diálogo Bem-vindo ao PowerApps Studio, clique ou toque em Ignorar.

  4. Adicione uma conexão à tabela FlooringEstimates no arquivo do Excel.

  5. (opcional) Adicione um controle Galeria à tela padrão ao clicar ou tocar na guia Inserir, ao clicar ou tocar em Galeria e, em seguida, ao clicar ou tocar em um controle Galeria que está vazio (em branco) ou que contém um conjunto padrão de controles.

    Essas opções incluem controles Galeria que rolam horizontal ou verticalmente. Você também pode adicionar uma Galeria que baseia automaticamente seu tamanho na quantidade de conteúdo de cada item.

    Adicionar galeria

  6. Na guia Página Inicial, clique ou toque em Nova tela.

    É possível adicionar uma tela que está vazia, que rola, que contém um controle Galeria ou que contém um formulário.

  7. Clique ou toque em Tela de lista para adicionar uma tela que contém um controle Galeria e outros controles, como uma barra de pesquisa.

    Observação: se você estiver adicionando um controle de Galeria a uma nova tela ou a uma tela existente, será possível clicar ou tocar na parte inferior do controle de Galeria para selecioná-lo, clique ou toque em Estimativas de Piso no painel à direita e, em seguida, clique ou toque em um layout diferente no painel Dados. Para este tutorial, deixe o layout padrão.

    Escolher o layout da galeria

  8. Clique ou toque no controle Galeria na tela que acabou de adicionar.

  9. Na guia Propriedades no painel à direita, clique ou toque em CustomGallerySample.

  10. No painel Dados, clique ou toque em CustomGallerySample e, em seguida, clique ou toque em FlooringEstimates.

    Selecione a fonte de dados

    O controle Galeria mostra os dados de exemplo.

    Mostrar dados

    Você configurará a classificação e pesquisa mais adiante neste tópico.

Adicionar um controle ao controle Galeria

Antes de fazer qualquer personalização, escolha um layout de controle Galeria. O primeiro conjunto de controles em um controle Galeria é o modelo, que determina como todos os dados do controle Galeria são exibidos.

  1. Selecione o modelo clicando ou tocando próximo à parte inferior do controle Galeria e, depois, clicando ou tocando no ícone de lápis no canto superior esquerdo.

    Editar modelo da galeria

  2. Com o modelo ainda selecionado, adicione um controle Rótulo e, em seguida, mova e redimensione-o para que não se sobreponha aos outros controles no modelo.

    Adicionar rótulo

  3. Abra o painel Dados ao selecionar o modelo e, em seguida, clique ou toque em Estimativas de Piso no painel à direita.

  4. Selecione o rótulo que você adicionou anteriormente neste procedimento e, em seguida, abra a lista realçada no painel Dados.

    Abrir lista suspensa

  5. Nessa lista, clique ou toque em Preço.

    Alterar a associação de rótulo

    O controle Galeria mostra os novos valores.

Galeria final

Filtrar o controle Galeria

A propriedade Items do controle Galeria determina quais itens são mostrados. Neste procedimento, você configurará essa propriedade para que o controle Galeria mostre somente os itens para os quais o nome do produto contém o texto em TextSearchBox1.

Caixa de pesquisa de texto

  1. Selecione o controle Galeria ao clicar ou tocar na parte inferior deste controle.

  2. Na guia Avançado, defina a propriedade Items do controle Galeria conforme esta fórmula:

    If(IsBlank(TextSearchBox1.Text), FlooringEstimates, Filter(FlooringEstimates, TextSearchBox1.Text in Text(Name)))

    Para obter mais informações sobre as funções desta fórmula, consulte a referência de fórmulas.

  3. Na caixa de pesquisa, digite parte ou todo o nome do produto.

    O controle Galeria mostra somente os itens que atendem aos critérios de filtro.

Classificar o controle Galeria

A propriedade Items de um controle Galeria determina a ordem na qual os itens são mostrados. Neste procedimento, você configura essa propriedade para que o controle Galeria mostre a ordem dos itens conforme definido por ImageSortUpDown1.

Imagem de classificação

  1. Defina a propriedade Items do controle Galeria para esta fórmula:

    Sort(If(IsBlank(TextSearchBox1.Text), FlooringEstimates, Filter(FlooringEstimates, TextSearchBox1.Text in Text(Name))), Name, If(SortDescending1, SortOrder.Descending, SortOrder.Ascending))

  2. Selecione o ícone de classificação para alterar a ordem de classificação do controle Galeria por nomes de produtos.

Para classificar e filtrar o controle Galeria:

  • Substitua as duas instâncias de DataSource nesta fórmula pelo nome da fonte de dados.
  • Substitua as duas instâncias de ColumnName pelo nome da coluna pela qual você deseja classificar e filtrar.

Sort(If(IsBlank(TextSearchBox1.Text), DataSource, Filter( DataSource, TextSearchBox1.Text in Text( ColumnName ))), ColumnName, If(SortDescending1, SortOrder.Descending, SortOrder.Ascending))

Realçar o item selecionado

Defina a propriedade TemplateFill do controle Galeria como uma fórmula semelhante a este exemplo:

If(ThisItem.IsSelected, LightCyan, White)

Alterar a seleção padrão

Defina a propriedade Padrão do controle Galeria para o registro que você deseja selecionar por padrão. Por exemplo, especifique o quinto item na fonte de dados FlooringEstimates:

Last(FirstN(FlooringEstimates, 5))

Neste exemplo, você especifica o primeiro item na categoria Hardwood da fonte de dados FlooringEstimates:

First(Filter(FlooringEstimates, Category = "Hardwood"))

Próximas etapas