Ir para o conteúdo

v1.0.3

pt-BR

Nesta página

Visão geral
Exemplo
Parâmetros
Eventos
Pacote
Controles relacionados

DataGrid

Complete

Tabela com ordenação (clique em um cabeçalho: crescente, decrescente, desligado), filtros por coluna, paginação, seleção de linhas e modelos.

Exemplo

Controle DataGrid

Parâmetros

DataGrid

Parâmetro	Tipo	Descrição
`Adaptive`	`bool`	Mostra cada linha como um cartão em telas estreitas.
`AllowAdd`	`bool`	Mostra um botão Add que cria um novo item (veja NewItemFactory).
`AllowCardView`	`bool`	Adiciona à barra de ferramentas um botão que alterna entre a tabela e a visualização em cartões.
`AllowDelete`	`bool`	Mostra o comando Delete na coluna de comandos (pede confirmação).
`AllowEdit`	`bool`	Mostra o comando Edit na coluna de comandos.
`AllowPaste`	`bool`	Modo em lote: adiciona um botão Paste que preenche as células editáveis a partir de texto da área de transferência separado por tabulações.
`AllowView`	`bool`	Adiciona um comando View que mostra a linha somente para leitura em uma caixa de diálogo.
`CardView`	`bool`	Mostra cada linha como um cartão em vez de uma linha de tabela. Use com @bind-CardView.
`CellNavigation`	`bool`	Faz da grade uma grade de teclado: as setas, Home, End, Page Up e Page Down movem entre células; Enter, F2 ou Espaço ativam o controle da célula.
`Class`	`string`	Classes CSS extras adicionadas ao elemento raiz.
`ColumnMenu`	`bool`	Adiciona a cada cabeçalho um botão de menu com comandos de ordenação e de ocultar coluna.
`Columns`	`RenderFragment`	Definições de colunas: elementos DataGridColumn.
`DataProvider`	`Func<DataGridRequest, ValueTask<DataGridResult<TItem>>>`	Carrega linhas do seu lado: recebe o início, a quantidade, a ordenação, os filtros, a pesquisa, os grupos e os agregados e um token de cancelamento (cancelado quando uma solicitação mais nova começa ou a grade é removida), e devolve um DataGridResult.
`Dense`	`bool`	Usa um preenchimento de célula mais justo.
`DetailTemplate`	`RenderFragment<TItem>`	Conteúdo mostrado sob uma linha quando o botão de expandir dela é pressionado.
`EditMode`	`DataGridEditMode`	None, Row (em linha), Dialog ou Batch (todas as linhas de uma vez).
`EmptyContent`	`RenderFragment`	Mostrado quando não há linhas.
`ExportChoices`	`bool`	Transforma Export em um menu: CSV ou JSON, visualização atual, linhas selecionadas, todas as linhas, colunas ocultas.
`ExportFileName`	`string`	Nome do arquivo da exportação CSV, sem a extensão.
`FilterOperators`	`bool`	Adiciona acima de cada caixa de filtro uma lista de operadores (contém, começa com, é igual a, maior que, está vazio...).
`FormatRules`	`IEnumerable<DataGridFormatRule>`	Regras que colorem células ou linhas: campo, operador de filtro, valor, gravidade e Cell ou Row. A primeira regra que corresponde vence.
`FreezeFirstColumn`	`bool`	Mantém a primeira coluna visível na rolagem lateral.
`FrozenColumns`	`int`	Número de colunas iniciais que permanecem à vista enquanto o restante rola para o lado.
`FrozenEndColumns`	`int`	Número de colunas na borda direita que permanecem à vista enquanto a tabela rola para o lado.
`FrozenRows`	`int`	Número de linhas que permanecem sob o cabeçalho enquanto o corpo rola (requer Height).
`GroupBy`	`Func<TItem, Object>`	Agrupa linhas pelo valor retornado; cada grupo tem um cabeçalho recolhível.
`GroupPanel`	`bool`	Adiciona uma faixa acima da tabela onde os usuários agrupam linhas arrastando cabeçalhos ou escolhendo colunas.
`GroupSummary`	`bool`	Mostra os agregados das colunas nas linhas de grupo (calculados localmente ou tomados de DataGridResult.Groups com um DataProvider).
`GroupTitle`	`string`	Texto antes do valor do grupo no cabeçalho.
`Height`	`string`	Altura máxima do corpo da grade, por exemplo 24rem (28rem por padrão com VirtualScroll).
`ItemKey`	`Func<TItem, Object>`	Devolve uma chave estável por item, para que a seleção e os detalhes abertos sobrevivam a recarregamentos.
`Items`	`IEnumerable<TItem>`	As opções entre as quais escolher.
`KeyboardShortcuts`	`bool`	Ctrl+A selecionar tudo, Ctrl+C copiar linhas selecionadas, Esc limpar a seleção, Alt+setas mudar de página.
`Label`	`string`	Texto visível do rótulo (gráficos: nome acessível; IconButton: nome acessível e dica de ferramenta).
`Loading`	`bool`	Mostra uma barra de progresso acima das linhas.
`LoadingSkeleton`	`bool`	Mostra linhas de espaço reservado durante o primeiro carregamento.
`LoadMore`	`bool`	Substitui o paginador por um botão Load more que acrescenta a próxima página.
`MultiSort`	`bool`	Shift+clique nos cabeçalhos ordena por várias colunas; os cabeçalhos mostram a ordem.
`NewItemFactory`	`Func<TItem>`	Cria o item para uma nova linha; por padrão é o construtor sem parâmetros.
`NoMatchContent`	`RenderFragment`	Conteúdo mostrado quando filtros ou pesquisa não deixam linhas (por padrão: um texto com Clear filters).
`PageSize`	`int`	Linhas por página.
`PageSizeOptions`	`IEnumerable<int>`	Quantidades de linhas oferecidas em uma lista suspensa sob a tabela.
`Paging`	`bool`	Mostra a barra de paginação (true por padrão).
`PastePreview`	`bool`	Modo em lote: mostra o que uma colagem vai alterar e pergunta antes de aplicá-la (ativado por padrão).
`PersistKey`	`string`	Lembra a posição e o tamanho (Window), a divisão (Splitter) ou o layout de um DataGrid (ordenação, filtros, colunas, larguras, página) no armazenamento local com este nome e os restaura da próxima vez.
`Reorderable`	`bool`	Permite que os usuários movam colunas arrastando os cabeçalhos ou com o menu Columns.
`Resizable`	`bool`	Adiciona uma alça de arrasto (e setas) para redimensionar cada coluna.
`RowClass`	`Func<TItem, string>`	Devolve uma classe CSS extra para uma linha.
`RowHeight`	`int`	Altura da linha em pixels quando VirtualScroll está ativado (44 por padrão).
`RowMenu`	`Func<TItem, IEnumerable<MenuCommand>>`	Devolve os comandos do menu de contexto de uma linha.
`RowReorder`	`bool`	Permite arrastar linhas umas sobre as outras; trate RowMoved para alterar a sua lista.
`RowSeverity`	`Func<TItem, Severity?>`	Devolve uma gravidade para tingir uma linha, ou null.
`RowValidator`	`Func<TItem, IEnumerable<string>>`	Verifica a linha inteira depois que a edição é aplicada; devolve textos de erro.
`SelectedItems`	`IEnumerable<TItem>`	Linhas selecionadas. Use com @bind-SelectedItems.
`Selection`	`SelectionMode`	None (padrão), Single ou Multiple.
`SelectionActions`	`RenderFragment<IReadOnlyList<TItem>>`	Botões na barra de seleção; recebe os itens selecionados.
`ServerBulkLimit`	`int`	Com DataProvider: o maior número de linhas que a grade pede em uma solicitação para selecionar todas as linhas filtradas ou exportá-las (10000 por padrão). Acima disso, só as linhas da página são usadas.
`ShowCopy`	`bool`	Mostra o botão de copiar.
`ShowFilters`	`bool`	Mostra uma caixa de filtro sob o cabeçalho de cada coluna filtrável.
`ShowPrint`	`bool`	Adiciona um botão Print que imprime a tabela.
`ShowSearch`	`bool`	Adiciona uma caixa de pesquisa que encontra texto em todas as colunas e o marca nas células.
`ShowSelectionBar`	`bool`	Mostra a barra com a contagem de selecionados, selecionar todas as linhas e limpar a seleção (seleção Multiple).
`ShowToolbar`	`bool`	Mostra a barra de ferramentas com o seletor de colunas e a exportação CSV.
`Striped`	`bool`	Sombreia uma linha sim, outra não.
`Style`	`string`	Estilo embutido adicionado ao elemento raiz.
`ToolbarContent`	`RenderFragment`	Conteúdo extra na barra de ferramentas de uma grade com ShowToolbar, por exemplo DataGridSpreadsheetButton.
`TypedFilters`	`bool`	Usa caixas de filtro de número, data e sim/não conforme o tipo dos valores da coluna (ativado por padrão).
`UndoRedo`	`bool`	Adiciona Desfazer e Refazer para edições de linhas salvas, linhas adicionadas e linhas excluídas (botões e Ctrl+Z / Ctrl+Y).
`ValueFilters`	`bool`	Adiciona a cada cabeçalho filtrável um filtro de lista de valores (pesquisar, selecionar tudo, limpar); funciona com itens na memória.
`VirtualScroll`	`bool`	Desenha apenas as linhas visíveis (as linhas devem ter a RowHeight fixa).

DataGridColumn

Parâmetro	Tipo	Descrição
`Aggregate`	`DataGridAggregate`	Adiciona um valor à linha de resumo: Sum, Average, Min, Max ou Count.
`Align`	`TextAlign`	Left (padrão), Center ou Right.
`BadgeSeverities`	`IReadOnlyDictionary<string, Severity>`	Cor de uma coluna Badge por valor.
`CellSeverity`	`Func<TItem, Severity?>`	Devolve uma gravidade para tingir uma célula, ou null.
`ColumnSpan`	`Func<TItem, int>`	Devolve quantas colunas a célula de um item cobre.
`DataBar`	`bool`	Desenha uma barra atrás dos números em relação ao maior valor da coluna.
`Editable`	`bool`	Permite que os usuários editem as células da coluna clicando nelas.
`EditOn`	`DataGridEditOn`	Always, Create (somente linhas novas) ou Update (somente linhas existentes).
`EditorOptions`	`IEnumerable<KeyValuePair<string, string>>`	Pares de valor e rótulo; o editor vira uma lista.
`Field`	`string`	Nome da propriedade do item (nomes aninhados como Address.City funcionam). Ele lê a célula, ordena e filtra quando Value não está definido, e é enviado ao DataProvider como identificador da coluna (Title por padrão).
`Filterable`	`bool`	Mostra uma caixa de filtro para esta coluna (true por padrão).
`Format`	`string`	String de formato para números e datas, p. ex. N0 ou d.
`Group`	`string`	Texto do cabeçalho empilhado acima desta coluna; vizinhas com o mesmo texto compartilham uma célula.
`HelpText`	`string`	Uma dica mostrada sob o campo na caixa de diálogo de edição.
`Hidden`	`bool`	Oculta a coluna no início; os usuários podem mostrá-la pela barra de ferramentas.
`ImageAlt`	`Func<TItem, string>`	Texto alternativo de uma coluna Image por linha.
`ImageHeight`	`int`	Altura da imagem em pixels (32 por padrão).
`LinkHref`	`Func<TItem, string>`	Endereço de uma coluna Link por linha (por padrão: o valor).
`LinkTarget`	`string`	Destino do link, por exemplo _blank.
`Max`	`Double?`	Maior valor permitido (ProgressBar: o valor que significa 100%; Rating: número de estrelas).
`MaxLength`	`int?`	Maior número de caracteres permitido.
`MaxWidth`	`string`	Container: largura máxima fixa a partir de um ponto de interrupção (Xs a Xxl). DataGridColumn: maior largura como comprimento CSS; a alça de redimensionamento para nela.
`MergeRows`	`bool`	Mescla verticalmente células vizinhas que têm o mesmo texto.
`Min`	`Double?`	Menor valor permitido.
`MinLength`	`int?`	Menor número de caracteres aceito ao salvar uma edição.
`Pattern`	`string`	Expressão regular com a qual o texto editado deve corresponder.
`PatternMessage`	`string`	Texto de erro mostrado quando Pattern não corresponde.
`ProgressMax`	`Double`	Valor que preenche uma coluna Progress (100 por padrão).
`Required`	`bool`	O editor recusa um valor vazio.
`Sortable`	`bool`	Permite ordenar por esta coluna (true por padrão).
`Template`	`RenderFragment<TItem>`	Conteúdo personalizado da célula. A linha está disponível como contexto.
`Title`	`string`	Texto de título (cabeçalho da gaveta, legenda de guia, título de coluna, legenda de etapa).
`Type`	`DataGridColumnType`	Como a célula é desenhada: Text, Check, Image, Progress, Link, Badge ou Dropdown.
`Validate`	`Func<TItem, Object, string>`	Etapa do Stepper: executada antes de avançar, devolva false para permanecer na etapa. Coluna do DataGrid: recebe o item e o valor interpretado e devolve um texto de erro ou null.
`Value`	`Func<TItem, Object>`	Devolve o valor da célula. Usado para exibição, ordenação e filtragem.
`Width`	`string`	Skeleton: qualquer comprimento CSS. Charts: largura do desenho em unidades SVG (o gráfico continua se ajustando ao seu contêiner).

Eventos

DataGrid

Evento	Tipo	Descrição
`CardViewChanged`	`EventCallback<bool>`	Gerado quando o usuário alterna entre a tabela e os cartões.
`OnLoadError`	`EventCallback<Exception>`	Gerado com a exceção quando DataProvider falha; a grade então não mostra linhas. Sem um tratador, o erro vai para o limite de erro.
`OnRowDeleting`	`EventCallback<DataGridRowChange<TItem>>`	Executado após a confirmação; defina Error no argumento para cancelar a exclusão.
`OnRowSaving`	`EventCallback<DataGridRowChange<TItem>>`	Executado antes de uma linha ser mantida; defina Error no argumento para cancelar e mostrar o texto.
`PageSizeChanged`	`EventCallback<int>`	Gerado quando outro tamanho de página é escolhido.
`RowAdded`	`EventCallback<TItem>`	Gerado com o novo item depois que ele foi salvo; adicione-o à sua lista.
`RowDeleted`	`EventCallback<TItem>`	Gerado com o item depois que a exclusão foi confirmada; remova-o da sua lista.
`RowMoved`	`EventCallback<DataGridRowMove<TItem>>`	Gerado quando uma linha é solta sobre outra: o item, os índices da página (FromIndex, ToIndex), os índices em toda a lista ordenada e filtrada (AbsoluteFromIndex, AbsoluteToIndex; PageOffset é a diferença) e o item sobre o qual foi solta (TargetItem).
`RowSaved`	`EventCallback<TItem>`	Gerado com o item depois que uma edição válida foi aplicada a ele.
`RowsPasted`	`EventCallback<int>`	Gerado com o número de linhas preenchidas por Paste.
`SelectedItemsChanged`	`EventCallback<IEnumerable<TItem>>`	Gerado quando a seleção muda.
`StateChanged`	`EventCallback<DataGridState>`	Informa o DataGridState após cada mudança de ordenação, filtros, colunas, larguras ou página.

DataGridColumn

Evento	Tipo	Descrição
`Edited`	`EventCallback<DataGridEdit<TItem>>`	Gerado com o item e o novo texto quando uma edição é confirmada.

Pacote

DataGrid faz parte do RayCraft Complete. Pacote: RayCraft.Blazor.Complete. Vem do feed privado do RayCraft e requer uma licença ativa. Veja Primeiros passos.

DataGridPdfButtonUm botão que exporta o DataGrid conectado para um arquivo PDF.

Enviar feedbackVersão 1.0.3