Visão geral do GridView

GridView O modo de exibição é um dos modos de exibição para um ListView controle. A GridView classe e suas classes de suporte permitem que você e seus usuários exibam coleções de itens em uma tabela que normalmente usa botões como cabeçalhos de coluna interativos. Este tópico apresenta a GridView classe e descreve seu uso.

O que é uma exibição GridView?

O GridView modo de exibição exibe uma lista de itens de dados associando campos de dados a colunas e exibindo um cabeçalho de coluna para identificar o campo. O estilo padrão GridView implementa botões como cabeçalhos de coluna. Usando botões para cabeçalhos de coluna, você pode implementar recursos importantes de interação do usuário; por exemplo, os usuários podem clicar no cabeçalho da coluna para classificar GridView dados de acordo com o conteúdo de uma coluna específica.

Observação

Os controles de botão usados GridView para cabeçalhos de coluna são derivados de ButtonBase.

A ilustração a seguir mostra uma GridView exibição do ListView conteúdo.

Captura de tela mostrando um ListView com saída em formato de GridView exibindo informações de arquivo.

GridView colunas são representadas por GridViewColumn objetos, que podem ser dimensionadas automaticamente ao seu conteúdo. Opcionalmente, você pode definir explicitamente GridViewColumn para uma largura específica. Você pode redimensionar colunas arrastando a alça entre os cabeçalhos das colunas. Você também pode adicionar, remover, substituir e reordenar colunas dinamicamente porque essa funcionalidade é incorporada GridView. No entanto, GridView não é possível atualizar diretamente os dados exibidos.

O exemplo a seguir mostra como definir um GridView que exibe dados de funcionários. Neste exemplo, ListView define o EmployeeInfoDataSource como o ItemsSource. As definições de propriedade de DisplayMemberBinding vinculam GridViewColumn conteúdo a EmployeeInfoDataSource categorias de dados.


<ListView ItemsSource="{Binding Source={StaticResource EmployeeInfoDataSource}}">

    <ListView.View>

        <GridView AllowsColumnReorder="true" ColumnHeaderToolTip="Employee Information">

            <GridViewColumn DisplayMemberBinding="{Binding Path=FirstName}" Header="First Name" Width="100"/>

            <GridViewColumn DisplayMemberBinding="{Binding Path=LastName}" Width="100">
                <GridViewColumnHeader>Last Name
                    <GridViewColumnHeader.ContextMenu>
                        <ContextMenu MenuItem.Click="LastNameCM_Click" Name="LastNameCM">
                            <MenuItem Header="Ascending" />
                            <MenuItem Header="Descending" />
                        </ContextMenu>
                    </GridViewColumnHeader.ContextMenu>
                </GridViewColumnHeader>
            </GridViewColumn>

            <GridViewColumn DisplayMemberBinding="{Binding Path=EmployeeNumber}" Header="Employee No." Width="100"/>
        </GridView>

    </ListView.View>
</ListView>

Layout e estilo do GridView

As células de coluna e o cabeçalho de coluna de um GridViewColumn têm a mesma largura. Por padrão, cada coluna dimensiona sua largura para ajustar seu conteúdo. Opcionalmente, você pode definir uma coluna como uma largura fixa.

O conteúdo de dados relacionado é exibido em linhas horizontais. Por exemplo, na ilustração anterior, o sobrenome, o nome e o número de ID de cada funcionário são exibidos como um conjunto porque aparecem em uma linha horizontal.

Definindo e estilizando colunas em um GridView

Ao definir o campo de dados a ser exibido em um GridViewColumn, use o DisplayMemberBinding, CellTemplate ou as CellTemplateSelector propriedades. A DisplayMemberBinding propriedade tem precedência sobre qualquer uma das propriedades do modelo.

Para especificar o alinhamento do conteúdo em uma coluna de um GridView, defina um CellTemplate. Não use as propriedades HorizontalContentAlignment e VerticalContentAlignment para conteúdo ListView exibido usando um GridView.

Para especificar propriedades de modelo e estilo para cabeçalhos de coluna, use as classes GridView, GridViewColumn e GridViewColumnHeader. Para obter mais informações, consulte GridView Column Header Styles and Templates Overview.

Adicionando elementos visuais a um GridView

Para adicionar elementos visuais, como CheckBox e Button controles, a um GridView modo de exibição, use modelos ou estilos.

Se você definir explicitamente um elemento visual como um item de dados, ele poderá aparecer apenas uma vez em um GridView. Essa limitação existe porque um elemento pode ter apenas um pai e, portanto, pode aparecer apenas uma vez na árvore visual.

Estilizando Linhas em um GridView

Use as classes GridViewRowPresenter e GridViewHeaderRowPresenter para formatar e exibir as linhas de um GridView. Para obter um exemplo de como estilizar linhas em um GridView modo de exibição, consulte Style a Row in a ListView That Implements a GridView.

Problemas de alinhamento ao usar ItemContainerStyle

Para evitar problemas de alinhamento entre cabeçalhos de coluna e células, não defina uma propriedade ou especifique um modelo que afete a largura de um item em um ItemContainerStyle. Por exemplo, não defina a Margin propriedade nem especifique um ControlTemplate que adicione um CheckBox a um ItemContainerStyle definido em um controle ListView. Em vez disso, especifique as propriedades e modelos que afetam a largura da coluna diretamente nas classes que definem um modo de exibição GridView .

Por exemplo, para adicionar CheckBox às linhas no modo de exibição GridView, adicione CheckBox a um DataTemplate, e defina a propriedade CellTemplate como essa DataTemplate.

Interações do usuário com um GridView

Quando você usa um GridView em seu aplicativo, os usuários podem interagir e modificar a formatação do GridView. Por exemplo, os usuários podem reordenar colunas, redimensionar uma coluna, selecionar itens em uma tabela e rolar pelo conteúdo. Você também pode definir um manipulador de eventos que responde quando um usuário clica no botão de cabeçalho da coluna. O manipulador de eventos pode executar operações como classificar os dados exibidos em GridView de acordo com o conteúdo de uma coluna.

A lista a seguir discute com mais detalhes os recursos de uso GridView para interação do usuário:

Reordene colunas usando o método de arrastar e soltar.

Os usuários podem reordenar colunas em um GridView pressionando o botão esquerdo do mouse enquanto ele estiver sobre um cabeçalho de coluna e arrastando essa coluna para uma nova posição. Enquanto o usuário arrasta o cabeçalho da coluna, uma versão flutuante do cabeçalho é exibida, bem como uma linha preta sólida que mostra onde inserir a coluna.

Se você quiser modificar o estilo padrão para a versão flutuante de um cabeçalho, especifique um ControlTemplate para um GridViewColumnHeader tipo que é disparado quando a Role propriedade é definida como Floating. Para obter mais informações, consulte Criar um estilo para um cabeçalho de coluna GridView arrastado.
Redimensione uma coluna para seu conteúdo.

Usuários podem clicar duas vezes no limitador à direita de um cabeçalho de coluna para redimensionar uma coluna para que caiba seu conteúdo.

Observação

Você pode definir a propriedade Width como Double.NaN para produzir o mesmo efeito.
Selecione itens da linha.

Os usuários podem selecionar um ou mais itens em um GridView.

Se você quiser alterar o Style de um item selecionado, consulte Use Triggers to Style Selected Items in a ListView.
Role para visualizar o conteúdo que não está inicialmente visível na tela.

Se o tamanho do GridView não for grande o suficiente para exibir todos os itens, os usuários poderão rolar horizontal ou verticalmente usando barras de rolagem, que são fornecidas por um ScrollViewer controle. Um ScrollBar ficará oculto se todo o conteúdo estiver visível em uma direção específica. Os cabeçalhos de coluna não rolam com uma barra de rolagem vertical, mas rolam horizontalmente.
Interaja com colunas clicando nos botões de cabeçalho da coluna.

Quando os usuários clicam em um botão de cabeçalho de coluna, eles podem classificar os dados exibidos na coluna se você tiver fornecido um algoritmo de classificação.

Você pode manipular o Click evento para botões de cabeçalho de coluna para fornecer funcionalidade como um algoritmo de classificação. Para manipular o Click evento para um único cabeçalho de coluna, defina um manipulador de eventos no GridViewColumnHeader. Para definir um manipulador de eventos que manipula o Click evento para todos os cabeçalhos de coluna, defina o manipulador no ListView controle.

Obtendo outras exibições personalizadas

A GridView classe, que é derivada da ViewBase classe abstrata, é apenas um dos modos de exibição possíveis para a ListView classe. Você pode criar outras exibições personalizadas derivando ListView da ViewBase classe. Para obter um exemplo de modo de exibição personalizado, consulte Criar um modo de exibição personalizado para um ListView.

Classes de suporte do GridView

As classes a seguir dão suporte ao modo de exibição GridView .

Estilos e modelos

Você pode personalizar a aparência dos cabeçalhos de GridView coluna modificando seus estilos e modelos. Esta seção discute a ordem de precedência das propriedades que você usa para personalizar um cabeçalho de coluna no modo de exibição GridView de um ListView controle. Para obter mais informações, consulte O que são estilos e modelos? e Como criar um modelo para um controle.

Personalizando um cabeçalho de coluna em um GridView

As propriedades que definem o conteúdo, o layout e o estilo de um cabeçalho de coluna em um GridView são encontradas em muitas classes relacionadas. Algumas dessas propriedades têm funcionalidade semelhante ou a mesma.

As linhas na tabela a seguir mostram grupos de propriedades que executam a mesma função. Você pode usar essas propriedades para personalizar os cabeçalhos de coluna em um GridView. A ordem de precedência para propriedades relacionadas é da direita para a esquerda, onde a propriedade na coluna mais distante à direita tem a precedência mais alta. Por exemplo, se um ContentTemplate for definido no objeto GridViewColumnHeader e o HeaderTemplateSelector for definido no GridViewColumn associado, a ContentTemplate terá precedência. Nesse cenário, o HeaderTemplateSelector não tem efeito.

Propriedades relacionadas para cabeçalhos de coluna em um GridView

	GridView	GridViewColumn	GridViewColumnHeader
Propriedades do menu de contexto	ColumnHeaderContextMenu	Não aplicável	ContextMenu
Tooltip Propriedades	ColumnHeaderToolTip	Não aplicável	ToolTip
Modelo de cabeçalho Propriedades	ColumnHeaderTemplate ¹/ ColumnHeaderTemplateSelector	HeaderTemplate ¹/ HeaderTemplateSelector	ContentTemplate ¹/ ContentTemplateSelector
Propriedades de estilo	ColumnHeaderContainerStyle	HeaderContainerStyle	Style

¹Para propriedades de modelo de cabeçalho, se você definir as propriedades do modelo e do seletor de modelo, a propriedade de modelo terá precedência. Por exemplo, se você definir as propriedades ContentTemplate e ContentTemplateSelector, a propriedade ContentTemplate terá precedência.

Consulte também

Comentários

Esta página foi útil?

Last updated on 2026-02-09