Share via


Comment : créer un style pour un en-tête de colonne GridView déplacé

Mise à jour : novembre 2007

Cet exemple montre comment modifier l'apparence d'un GridViewColumnHeader déplacé lorsque l'utilisateur change la position d'une colonne.

Exemple

Lorsque vous déplacez un en-tête de colonne à un autre emplacement dans un ListView qui utilise GridView comme mode d'affichage, la colonne est déplacée à la nouvelle position. Lorsque vous déplacez l'en-tête de colonne, une copie flottante de l'en-tête apparaît en plus de l'en-tête d'origine. Dans un GridView, un en-tête de colonne est représenté par un objet GridViewColumnHeader.

Pour personnaliser l'apparence des en-têtes flottant et d'origine, vous pouvez définir des Triggers pour modifier le Style GridViewColumnHeader. Ces Triggers sont appliqués lorsque la valeur de la propriété IsPressed est true et que la valeur de la propriété Role est Floating.

Lorsque l'utilisateur appuie sur le bouton de la souris et le maintient enfoncé quand la souris passe sur le GridViewColumnHeader, la valeur de la propriété IsPressed devient true. De même, lorsque l'utilisateur commence l'opération de glissement, la propriété Role devient Floating.

L'exemple suivant montre comment définir Triggers pour modifier les couleurs de Foreground et d'Background des en-têtes flottant et d'origine lorsque l'utilisateur déplace une colonne à une nouvelle position.

<ControlTemplate TargetType="{x:Type GridViewColumnHeader}">


...


<ControlTemplate.Triggers>


...


<Trigger Property="IsPressed"
         Value="true">
  <Setter TargetName="HighlightBorder"
          Property="Visibility"
          Value="Hidden"/>
  <Setter TargetName="PART_HeaderGripper"
          Property="Visibility"
          Value="Hidden"/>
  <Setter Property="Background"
          Value="SkyBlue"/>
  <Setter Property="Foreground"
          Value="Yellow"/>
</Trigger>


...


<Trigger Property="Role"
         Value="Floating">
  <Setter TargetName="PART_HeaderGripper"
          Property="Visibility"
          Value="Collapsed"/>
  <Setter Property="Background"
          Value="Yellow"/>
  <Setter Property="Foreground"
          Value="SkyBlue"/>
</Trigger>


...


</ControlTemplate.Triggers>


...


</ControlTemplate>

Pour l'exemple complet, consultez ListView avec en-tête flottant personnalisé, exemple.

Voir aussi

Concepts

Vue d'ensemble de ListView

Vue d'ensemble de GridView

Référence

GridViewColumnHeader

GridViewColumnHeaderRole

ListView

GridView

Autres ressources

Rubriques Comment relatives à ListView

Exemples de ListView