Data Grid Power Apps: como ativar e personalizar colunas

O problema que o data grid power apps resolve em cooperativas de crédito

Um app de canvas para acompanhamento de propostas de crédito costuma começar simples. Uma Gallery, algumas dezenas de registros, tudo rápido. O problema aparece quando a carteira cresce: a lista de propostas em análise passa de duzentas para dez mil linhas, o analista rola a tela por minutos procurando um CPF, e a Gallery começa a travar porque cada linha renderiza um conjunto inteiro de controles repetidos. O data grid power apps foi liberado em disponibilidade geral justamente para esse cenário: uma grade densa, baseada em Fluent UI, pensada para exibir muitos registros tabulares com busca, ordenação e seleção nativas, sem que o maker precise reconstruir a experiência do zero.

Este tutorial mostra como habilitar o Data Grid em um app de canvas já existente, como destravar colunas para personalizá-las com Power Fx, e como configurar a grade para não perder desempenho quando a fonte de dados é uma lista grande do SharePoint ou uma tabela do Dataverse. No fim, também mostro a armadilha mais comum de quem migra de Gallery para Data Grid sem revisar fórmulas que dependiam de posição de linha.

Pré-requisitos

• Licença: qualquer plano de Power Apps que já habilite canvas apps (per app ou per user). Se a fonte de dados for Dataverse, confirme que a licença cobre o acesso à tabela, não apenas ao ambiente.
• Papel no tenant: permissão de App Editor sobre o app, e acesso de leitura/escrita na fonte de dados (associado ao SharePoint site como membro, ou à tabela do Dataverse com a security role correspondente).
• Ambiente: Power Apps Studio atualizado. O Data Grid entrou em disponibilidade geral na atualização de julho e agosto de 2026; se o Studio do tenant estiver em um canal de release mais antigo, o controle pode não aparecer na lista de inserção ainda.
• App: um canvas app existente, publicado ou em edição. Funciona tanto para apps novos quanto para apps antigos, desde que os controles modernos estejam habilitados (passo 1 abaixo).
• Fonte de dados: uma lista do SharePoint (por exemplo, Propostas de Crédito ou Associados) ou uma tabela do Dataverse já conectada, ou pronta para ser adicionada como fonte de dados do app.

Passo a passo

Passo 1: confirme que o app está usando controles modernos

Vá em Configurações (ícone de engrenagem no canto superior) > Próximos recursos e verifique se a seção de controles modernos está ativa. O Data Grid é construído sobre Fluent UI, a mesma base dos controles modernos de formulário, cartão e ícone. Apps criados antes dessa geração de controles rodam em modo clássico por padrão, e o Data Grid simplesmente não aparece na lista de inserção até essa opção estar marcada.

Se o app já foi criado recentemente com o template padrão do Studio, é provável que essa opção já esteja ativa. Ainda assim, vale confirmar antes de perder tempo procurando o controle no menu errado.

Passo 2: insira o Data Grid na tela

Caminho: Inserir > Layout (ou a seção de controles modernos, dependendo da versão do Studio) > Data grid. Arraste o controle para a tela e redimensione conforme o espaço disponível.

O racional aqui é simples: diferente da Gallery, que exige desenhar manualmente um template de linha com controles posicionados um a um, o Data Grid já nasce com uma estrutura de colunas pronta para dados tabulares. Isso economiza o trabalho de layout que normalmente consome a maior parte do tempo de quem monta uma tela de listagem.

Passo 3: conecte a fonte de dados e revise as colunas automáticas

Na propriedade Items do Data Grid, aponte para a fonte de dados. Para uma lista do SharePoint chamada Propostas de Crédito, a fórmula fica assim:

'Propostas de Credito'

Se quiser já entregar um recorte filtrado, por exemplo apenas propostas em análise, use uma função delegável direto na propriedade Items:

Filter(
    'Propostas de Credito',
    Status.Value = "Em analise"
)

Ao conectar a fonte, o Data Grid gera colunas automaticamente refletindo os campos da lista ou tabela. Use o editor de campos (o ícone de “Editar campos” no painel de propriedades, à direita) para reordenar colunas, ocultar as que não interessam ao analista, e ajustar a largura inicial. Nesse ponto, cada coluna ainda está vinculada diretamente ao campo de origem, sem personalização.

Passo 4: destrave uma coluna e personalize com Power Fx

Cada coluna vem com um ícone de cadeado indicando que está em modo automático, vinculada diretamente ao campo da fonte. Clique no cadeado e escolha Desbloquear para personalizar. Isso converte a coluna de um binding direto para uma fórmula Power Fx editável, referenciando o registro da linha atual.

Um uso comum em cooperativa de crédito é colorir a coluna de status da proposta conforme o valor:

If(
    ThisRecord.Status.Value = "Aprovada",
    Color.Green,
    ThisRecord.Status.Value = "Reprovada",
    Color.Red,
    Color.FromHex("#F2C94C")
)

Outro cenário frequente é calcular uma coluna que não existe na fonte, como dias de atraso a partir da data de vencimento:

DateDiff(
    ThisRecord.DataVencimento,
    Today(),
    Days
)

E, a partir desse valor calculado, uma segunda coluna de severidade textual:

If(
    ThisRecord.DiasAtraso > 30,
    "Critico",
    ThisRecord.DiasAtraso > 0,
    "Atencao",
    "Em dia"
)

Isso permite que uma única grade substitua o que antes exigia uma Gallery com múltiplos rótulos condicionais, ícones e cores calculadas manualmente em cada template de linha.

Passo 5: configure seleção, ordenação e busca

Na propriedade SelectionType, escolha entre None, Single ou Multiple. Quando Multiple está ativo, uma coluna de seleção com caixas de marcação aparece automaticamente à esquerda da grade, sem precisar desenhar nada.

Ative AllowSorting para permitir que o analista clique no cabeçalho de qualquer coluna e reordene os dados sem precisar de um botão dedicado. Se a busca estiver disponível na versão do controle instalada no tenant, ative-a para filtrar em tempo real sobre os dados já carregados, útil quando o analista procura um associado pelo nome ou pelo número do contrato.

Esse conjunto de três propriedades resolve, de forma nativa, o que antes exigia combinar um campo de texto de busca, uma função Filter manual e uma lógica própria de ordenação clicável na Gallery.

Passo 6: otimize o desempenho para listas grandes de SharePoint ou Dataverse

O Data Grid renderiza em fluent e carrega os dados em lotes, o que já reduz o custo de exibição comparado a uma Gallery com muitos controles por linha. Mas o ganho real de desempenho em listas grandes depende da delegação da fonte de dados, não só do controle visual.

Na propriedade Items, prefira funções delegáveis (Filter, Sort, SortByColumns) em vez de trazer a base inteira para o cliente e filtrar depois com funções não delegáveis. Em listas do SharePoint, fique atento ao limite de visualização de 5.000 itens: se a fórmula de Items não for totalmente delegável, o Data Grid trabalha apenas com os primeiros registros retornados, e o analista pode achar que uma proposta “sumiu” quando na verdade ela está fora da janela processada no servidor.

No Dataverse a cobertura de delegação é mais ampla, incluindo filtros por lookup e ordenação por colunas relacionadas, o que costuma tornar tabelas do Dataverse mais previsíveis que listas do SharePoint quando o volume passa de alguns milhares de registros.

No rodapé do Studio, observe o ícone de aviso de delegação. Se ele aparecer amarelo ao lado da propriedade Items, a fórmula tem uma parte que não roda no servidor, e o comportamento em produção com a base cheia vai divergir do que você vê durante o desenvolvimento com poucos registros de teste.

Passo 7: migrando de Gallery para Data Grid sem perder o layout

Se o app já existe e usa uma Gallery para listar propostas ou associados, existe um caminho de atualização de tabela clássica para Data Grid, pensado para evitar reconstruir o app do zero. Ainda assim, essa migração tem uma armadilha que vale expor com clareza.

Galleries permitem fórmulas baseadas em posição da linha na tela, como Index(Gallery1.AllItems, n), ou lógica que usa First(Gallery1.AllItems) para tratar a primeira linha de forma diferente, ou ainda contadores manuais combinando CountRows(Gallery1.AllItems) com a posição de rolagem. O Data Grid não expõe uma coleção de linhas replicadas na tela da mesma forma que a Gallery. Colunas personalizadas com Power Fx operam sobre o registro atual, referenciado como ThisRecord, não sobre a posição visual da linha. Se o maker migra a Gallery para Data Grid e mantém fórmulas que dependem de índice ou de posição de rolagem, elas param de calcular corretamente, ou pior, calculam um valor que parece plausível mas está associado à linha errada depois que a grade reordena ou pagina os dados de forma independente da ordem original.

O segundo ponto de atenção é a propriedade de seleção. Fórmulas em outros controles do app que referenciam Gallery1.Selected.Campo param de funcionar quando a Gallery é substituída pelo Data Grid, porque o nome do controle muda e a propriedade equivalente de seleção também muda de nome conforme o tipo de seleção configurado (single ou multiple). Antes de trocar o controle, faça uma busca por todas as referências ao nome da Gallery no editor de fórmulas do app, revise uma por uma, e só então apague o controle antigo.

A recomendação prática é: trate a migração como um refactor deliberado, não como uma troca de controle de um clique. Reserve tempo para revisar cada fórmula que menciona a Gallery antes de removê-la da tela.

Como validar que deu certo

• Publique o app e abra em modo de execução (Play). A grade deve aparecer densa, com cabeçalhos clicáveis para ordenação e, se configurado, uma barra de busca visível.
• Clique no cabeçalho de uma coluna e confirme que os dados reordenam sem erro no console de desenvolvedor.
• Na coluna personalizada com Power Fx (por exemplo, o status colorido), confirme que a cor muda corretamente registro a registro, e não fica fixa no mesmo valor para todas as linhas.
• Se configurou seleção múltipla, marque duas ou três linhas e confirme, em um rótulo de teste, que DataGrid1.SelectedItems retorna a coleção correta de registros marcados.
• Com a base de produção carregada (não a base de teste com poucos registros), meça o tempo até a grade ficar interativa e compare com o tempo da Gallery anterior, se ainda tiver esse número.

Erros comuns

• “Delegation warning: parte desta fórmula pode não ser processada pelo servidor de dados”: a função usada na propriedade Items não é totalmente delegável para a fonte conectada. Comum em filtros complexos sobre campos de pessoa ou de escolha múltipla no SharePoint.
• Coluna personalizada mostra “#error” na célula: a fórmula referencia o nome de exibição do campo, mas o SharePoint costuma gerar um nome interno diferente quando o campo tem espaço ou acento no título original (por exemplo, um campo chamado “Status Proposta” pode ter nome interno Status_x0020_Proposta). Confirme o nome interno no editor de campos antes de escrever a fórmula.
• Tela fica em branco ou o app trava ao inserir o Data Grid em um app antigo: os controles modernos não foram habilitados nas configurações do app (passo 1), e o runtime não reconhece o controle.
• Coluna de seleção não aparece mesmo com marcação múltipla esperada: a propriedade SelectionType está configurada como Single ou None em vez de Multiple.
• Fórmula em outra tela retorna “nome não reconhecido” depois da migração: uma referência antiga ao nome da Gallery removida ainda existe em outra tela ou em um componente reutilizável, e não foi atualizada para o nome do novo Data Grid.

Fechamento

O Data Grid resolve um problema concreto de quem opera carteiras grandes em canvas apps: densidade de dados sem sacrificar desempenho, com personalização de coluna via Power Fx no lugar de templates de linha montados à mão. A parte que exige cuidado é a migração de apps existentes, onde fórmulas herdadas de Gallery carregam suposições sobre índice e seleção que não se traduzem automaticamente. Quando o app de crédito, de cobrança ou de atendimento a associado já tem alguma complexidade acumulada, vale revisar essa migração com quem trabalha esse tipo de arquitetura no dia a dia antes de trocar o controle em produção.