C# WPF XAML DataGrid ColumnHeaderStyle с GridSplitter

114

07 июня 2019, 15:20

Написал свой стиль для DataGridColumnHeader, но теперь нет возможности изменять длину столбцов. Как сделать реализацию изменения длины столбцов?

<DataGrid.ColumnHeaderStyle>
  <Style TargetType="DataGridColumnHeader">
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
          <Grid Background="#414073">
            <Themes:DataGridHeaderBorder Name="Border" BorderBrush="White" BorderThickness="1, 0, 1, 0" Background="{TemplateBinding Background}" IsClickable="{TemplateBinding CanUserSort}" IsPressed="{TemplateBinding IsPressed}" IsHovered="{TemplateBinding IsMouseOver}" Padding="{TemplateBinding Padding}" SortDirection="{TemplateBinding SortDirection}" SeparatorBrush="{TemplateBinding SeparatorBrush}" SeparatorVisibility="{TemplateBinding SeparatorVisibility}">
              <Border BorderThickness="5" BorderBrush="Transparent">
                 <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" TextBlock.Foreground="White" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
               </Border>
            </Themes:DataGridHeaderBorder>
            <Thumb x:Name="PART_LeftHeaderGripper" BorderBrush="White" Visibility="Visible" HorizontalAlignment="Left">
              <Thumb.Style>
                <Style TargetType="{x:Type Thumb}">
                  <Setter Property="Width" Value="3"/>
                  <Setter Property="Cursor" Value="SizeWE"/>
                  <Setter Property="Template">
                   <Setter.Value>
                     <ControlTemplate TargetType="{x:Type Thumb}">
                       <Rectangle Fill="Transparent"/>
                     </ControlTemplate>
                   </Setter.Value>
                </Setter>
              </Style>
            </Thumb.Style>
          </Thumb>
          <Thumb x:Name="PART_RightHeaderGripper" BorderBrush="White" Visibility="Visible" HorizontalAlignment="Right">
            <Thumb.Style>
              <Style TargetType="{x:Type Thumb}">
                <Setter Property="Width" Value="3"/>
                <Setter Property="Cursor" Value="SizeWE"/>
                Setter Property="Template">
                <Setter.Value>
                  <ControlTemplate TargetType="{x:Type Thumb}">
                    <Rectangle Fill="Transparent"/>
                  </ControlTemplate>
                </Setter.Value>
              </Setter>
            </Style>
          </Thumb.Style>
        </Thumb>
      </Grid>
    <ControlTemplate.Triggers>
      <Trigger Property="DisplayIndex" Value="0">
        <Setter TargetName="PART_LeftHeaderGripper" Property="Visibility" Value="Collapsed"/>
      </Trigger>
      <Trigger Property="DisplayIndex" Value="0">
        <Setter TargetName="Border" Property="BorderThickness" Value="0, 0, 1, 0"/>
      </Trigger>
        <Trigger Property="DisplayIndex" Value="4">
        <Setter TargetName="Border" Property="BorderThickness" Value="1, 0, 0, 0"/>
        </Trigger>
        </ControlTemplate.Triggers>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>
</DataGrid.ColumnHeaderStyle>

Перетащиваю мышкой Test 4

DataGrid полностю

Answer 1

Стандартный шаблон выглядит так (в теме Aero для Windows 7):

<ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
    <Grid>
        <Themes:DataGridHeaderBorder BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" IsClickable="{TemplateBinding CanUserSort}" IsPressed="{TemplateBinding IsPressed}" IsHovered="{TemplateBinding IsMouseOver}" Padding="{TemplateBinding Padding}" SortDirection="{TemplateBinding SortDirection}" SeparatorBrush="{TemplateBinding SeparatorBrush}" SeparatorVisibility="{TemplateBinding SeparatorVisibility}">
            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
        </Themes:DataGridHeaderBorder>
        <Thumb x:Name="PART_LeftHeaderGripper" HorizontalAlignment="Left" Style="{StaticResource ColumnHeaderGripperStyle}"/>
        <Thumb x:Name="PART_RightHeaderGripper" HorizontalAlignment="Right" Style="{StaticResource ColumnHeaderGripperStyle}"/>
    </Grid>
</ControlTemplate>

Соответственно, все что вам нужно — это обернуть свой шаблон в Grid и добавить в него два элемента Thumb для перетаскивания:

<ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
    <Grid>
        <!--Ваш шаблон здесь-->
        <Thumb x:Name="PART_LeftHeaderGripper" HorizontalAlignment="Left" Style="{StaticResource ColumnHeaderGripperStyle}"/>
        <Thumb x:Name="PART_RightHeaderGripper" HorizontalAlignment="Right" Style="{StaticResource ColumnHeaderGripperStyle}"/>
    </Grid>
</ControlTemplate>