Compartilhar via

Como estilizar uma linha em um ListView que implementa um GridView

Este exemplo mostra como estilizar uma linha em um controle ListView que utiliza o modo GridViewView.

Exemplo

Você pode estilizar uma linha em um controle ListView definindo um ItemContainerStyle no controle ListView. Defina o estilo para seus itens que são representados como ListViewItem objetos. Os ItemContainerStyle se referem aos ControlTemplate objetos que são usados para exibir o conteúdo da linha.

O exemplo completo, do qual os exemplos a seguir são extraídos, exibe uma coleção de informações de música armazenadas em um banco de dados XML. Cada música no banco de dados tem um campo de classificação e o valor desse campo especifica como exibir uma linha de informações de música.

O exemplo a seguir mostra como definir ItemContainerStyle para os ListViewItem objetos que representam as músicas na coleção de músicas. Os ItemContainerStyle objetos de referência ControlTemplate que especificam como exibir uma linha de informações de música.

 <ListView.ItemContainerStyle>
  <Style TargetType="{x:Type ListViewItem}"  >
    <Setter Property="Template"
          Value="{StaticResource Default}"/>
    <Style.Triggers>
      <DataTrigger Binding="{Binding XPath=@Rating}" Value="5">
              <Setter Property="Template" 
              Value="{StaticResource StronglyRecommended}"/>
      </DataTrigger>
      <DataTrigger Binding="{Binding XPath=@Rating}" Value="4">
        <Setter Property="Template" 
              Value="{StaticResource Recommended}"/>
      </DataTrigger>
    </Style.Triggers>
  </Style>
</ListView.ItemContainerStyle>

O exemplo a seguir mostra um ControlTemplate que adiciona a string de texto "Strongly Recommended" à linha. Esse modelo é referenciado no ItemContainerStyle e é exibido quando a classificação da canção tem um valor de 5 (cinco). ControlTemplate inclui um GridViewRowPresenter objeto que organiza o conteúdo da linha em colunas, conforme definido pelo modo de visualização GridView.

<ControlTemplate x:Key="StronglyRecommended" 
                 TargetType='{x:Type ListViewItem}'>
  <StackPanel Background="Beige">
    <GridViewRowPresenter Content="{TemplateBinding Content}"
       Columns="{TemplateBinding GridView.ColumnCollection}"/>
    <TextBlock Background="LightBlue" Text="Strongly Recommended" />
  </StackPanel>
</ControlTemplate>

O exemplo a seguir define GridView.

<ListView.View>
  <GridView ColumnHeaderContainerStyle="{StaticResource MyHeaderStyle}">
    <GridViewColumn Header="Name" 
                    DisplayMemberBinding="{Binding XPath=@Name}" 
                    Width="100"/>
    <GridViewColumn Header="Time" 
                    DisplayMemberBinding="{Binding XPath=@Time}" 
                    Width="80"/>
    <GridViewColumn Header="Artist"  
                    DisplayMemberBinding="{Binding XPath=@Artist}" 
                    Width="80" />
    <GridViewColumn Header="Disk" 
                    DisplayMemberBinding="{Binding XPath=@Disk}"  
                    Width="100"/>
  </GridView>
</ListView.View>

Consulte também

  • Last updated on