Как создать стиль для перетаскиваемого заголовка столбца GridView

  • Статья

В этом примере показано, как изменить внешний вид перетаскиваемого элемента GridViewColumnHeader, когда пользователь изменяет положение столбца.

Пример

При перетаскивании заголовка столбца в другое место внутри элемента управления ListView в режиме просмотра GridView столбец перемещается в новое положение. Во время перетаскивания заголовка столбца в дополнение к исходному заголовку отображается перемещаемая копия заголовка. Заголовок столбца в элементе управления GridView представлен объектом GridViewColumnHeader.

Чтобы настроить внешний вид как перемещаемых, так и исходных заголовков, можно настроить свойства Triggers для изменения стиля элемента GridViewColumnHeaderStyle. Эти свойства Triggers применяются, когда свойство IsPressed имеет значение true, а свойство Role — значение Floating.

Когда пользователь нажимает кнопку мыши и удерживает ее, пока указатель мыши находится на элементе GridViewColumnHeader, значение свойства IsPressed меняется на true. Аналогично, когда пользователь начинает перетаскивание, значение свойства Role изменяется на Floating.

В следующем примере показано, как настроить свойства Triggers для изменения цветов Foreground и Background исходного и перемещаемого заголовка при перетаскивании столбца в новое положение.

<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>

См. также