Partilhar via


Como usar modelos para criar um ListView que use GridView

Este exemplo mostra como usar os DataTemplate objetos e Style para especificar a aparência de um controle que usa um ListViewGridView modo de exibição.

Exemplo

Os exemplos a seguir mostram Style e DataTemplate objetos que personalizam a aparência de um cabeçalho de coluna para um GridViewColumnarquivo .

<Style x:Key="myHeaderStyle" TargetType="{x:Type GridViewColumnHeader}">
  <Setter Property="Background" Value="LightBlue"/>
</Style>
<DataTemplate x:Key="myHeaderTemplate">
  <DockPanel>
    <CheckBox/>
    <TextBlock FontSize="16" Foreground="DarkBlue">
      <TextBlock.Text>
        <Binding/>
      </TextBlock.Text>
    </TextBlock>
  </DockPanel>
</DataTemplate>

O exemplo a seguir mostra como usar esses Style e objetos para definir as HeaderContainerStyle propriedades e DataTemplateHeaderTemplate de um GridViewColumnarquivo . A DisplayMemberBinding propriedade define o conteúdo das células da coluna.

<GridViewColumn Header="Month" Width="80"
      HeaderContainerStyle="{StaticResource myHeaderStyle}"
      HeaderTemplate="{StaticResource myHeaderTemplate}"
      DisplayMemberBinding="{Binding Path=Month}"/>

O HeaderContainerStyle e HeaderTemplate são apenas duas das várias propriedades que você pode usar para personalizar a aparência do cabeçalho de coluna para um GridView controle. Para obter mais informações, consulte Visão geral de modelos e estilos de cabeçalho de coluna GridView.

O exemplo a seguir mostra como definir um que personaliza a aparência das células em um DataTemplateGridViewColumnarquivo .

<DataTemplate x:Key="myCellTemplateMonth">
  <DockPanel>
    <TextBlock Foreground="DarkBlue" HorizontalAlignment="Center">
      <TextBlock.Text>
        <Binding Path="Month"/>
      </TextBlock.Text>
    </TextBlock>
  </DockPanel>
</DataTemplate>

O exemplo a seguir mostra como usar isso DataTemplate para definir o conteúdo de uma GridViewColumn célula. Esse modelo é usado em vez da propriedade mostrada DisplayMemberBinding no exemplo anterior GridViewColumn .

<GridViewColumn Header="Month" Width="80"
      CellTemplate="{StaticResource myCellTemplateMonth}"/>

Confira também