Tutorial: Personalizar uma galeria no Power Apps

Neste tutorial, você personalizará uma lista de registros, chamada de galeria, e fará outras alterações em um aplicativo que foi gerado automaticamente no Microsoft Power Apps. Os usuários podem gerenciar dados no aplicativo mesmo que você não faça essas alterações, mas o aplicativo será mais fácil de usar se você personalizá-los para as necessidades da sua organização.

Por exemplo, a galeria deste tutorial corresponde a esse gráfico por padrão. O endereço de email é apresentado com mais destaque do que outros tipos de dados, e os usuários podem classificar e filtrar a galeria com base no texto nesse endereço:

No entanto, os usuários podem estar mais interessados no nome da conta do que no endereço de email, portanto, você reconfigura a galeria para realçar, classificar e filtrar com base nos dados principais da sua organização. Além disso, você alterará o título da tela padrão para diferenciá-la das outras telas do aplicativo.

Você também adicionará uma barra de rolagem para que os usuários que não têm telas sensíveis ao toque ou rodas de mouse possam navegar por toda a galeria.

Este tutorial começa com um aplicativo que foi gerado de uma fonte de dados específica. No entanto, os mesmos conceitos se aplicam a qualquer aplicativo gerado no Power Apps, seja de uma lista criada usando o Microsoft Lists, uma biblioteca do SharePoint, uma tabela do Excel ou alguma outra fonte de dados.

Se você não estiver inscrito no Power Apps, inscreva-se gratuitamente antes de começar.

Pré-requisitos

Gere um aplicativo da tabela Contas do Microsoft Dataverse.

Abrir o aplicativo gerado

1. Entre no Power Apps e selecione Aplicativos próximos à borda esquerda.

2. Encontre o aplicativo que você gerou, selecione o ícone de elipse (...) para ele e depois selecione Editar.

   

3. Se a caixa de diálogo Bem-vindo ao Power Apps Studio for exibida, selecione Ignorar.

Alterar o layout

1. No painel de navegação esquerdo, selecione BrowseGallery1.

   Quando a galeria for selecionada, uma caixa de seleção com alças a contornará.

   

2. Na guia Propriedades do painel direito, abra a lista de opções em Layout e selecione a opção que mostra apenas um título.

   

3. Ao lado de Campos, selecione Editar e, em seguida, selecione a seta para baixo para o campo de título.

   O nome desse controle terminará em um numeral, como Title1, mas o numeral pode ser diferente com base em outras ações que você pode ter tomado.

4. Na lista de opções, selecione o nome da conta e feche o painel Dados .

   A galeria mostra o nome de cada conta.

   

Alterar colunas de classificação e pesquisa

1. Selecione a galeria como a seção anterior descreve.

   

2. Perto do canto superior esquerdo, confirme se a lista de propriedades mostra Items.

   

   O valor dessa propriedade aparece na barra de fórmulas. Você define essa propriedade para especificar não apenas a fonte de dados da galeria, mas também as colunas pelas quais os usuários podem classificar e pesquisar os dados.

3. Copie essa fórmula e cole-a na barra de fórmulas.

   SortByColumns(Search(Accounts, TextSearchBox1.Text, "name"), "name", If(SortDescending1, Descending, Ascending))

   Usando essa fórmula, você garante que:

   • Se um usuário digitar um ou mais caracteres na barra de pesquisa, a galeria mostrará apenas os nomes de conta que contêm o texto que o usuário digitou.
   • Se um usuário selecionar o ícone de classificação, a galeria será classificada em ordem alfabética por nome de conta em ordem crescente ou decrescente, dependendo de quantas vezes o usuário selecionar o ícone.

   Para obter mais informações sobre essas e outras funções, consulte a referência de fórmula.

Testar ordenação e busca

1. Abra o modo de visualização pressionando F5 (ou selecionando o botão de reprodução próximo ao canto superior direito).

   

2. Próximo ao canto superior direito da tela de navegação, selecione o ícone de classificação uma ou mais vezes para alterar a ordem de classificação alfabética entre crescente e decrescente.

   

3. Na caixa de pesquisa, digite k para mostrar apenas os nomes de conta que contêm a letra que você digitou.

   

4. Remova todo o texto da barra de pesquisa e feche o modo de visualização pressionando Esc (ou selecionando o ícone de fechamento próximo ao canto superior direito).

Alterar o título da tela

1. Selecione o título da tela clicando ou tocando nela.

   

2. Verifique se a lista de propriedades mostra Text e, em seguida, na barra de fórmulas, substitua Accounts por Browse (mantendo as aspas duplas).

   

   A tela reflete a alteração.

   

Mostrar uma barra de rolagem

Se os usuários não tiverem telas sensíveis ao toque nem rodas de mouse, configure a galeria para mostrar uma barra de rolagem quando o usuário passar o mouse sobre ela. Dessa forma, os usuários podem mostrar todas as contas, mesmo que a tela não possa mostrar todas elas de uma só vez.

1. Selecione a galeria como o primeiro procedimento descreve.

   

2. Defina a propriedade Mostrar barra de rolagem da galeria como true.

Próximas etapas

Neste tutorial, você personalizou a galeria e fez outras alterações na tela padrão para navegar registros em um aplicativo gerado. Você também pode personalizar as telas padrão para exibir detalhes e criar ou atualizar contas. Como a tela de navegação contém uma galeria, as outras duas telas no aplicativo contêm formulários. Você pode alterar, por exemplo, quais tipos de dados os formulários mostram e em qual ordem.