0

我为 DataGridColumnHeader 创建了一个样式。大部分都在工作,但我通过标题文本获得了第二个边框,我不知道如何解决这个问题。请参阅下图了解我得到的结果:

DataGridColumnHeader 双边框

我只想要文本下方的一个边框。这是我制作的样式:

<Style TargetType="{x:Type DataGridColumnHeader}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
                <Grid Name="HeaderGrid">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="14" />
                    </Grid.ColumnDefinitions>
                    <Border
                        x:Name="BackgroundBorder"
                        Grid.ColumnSpan="2"
                        BorderBrush="{DynamicResource Dark}"
                        BorderThickness="0,0,1,1"/>
                    <ContentPresenter
                        Grid.Column="0"
                        Margin="6,3,6,3"
                        VerticalAlignment="Center" />
                    <Path
                        x:Name="SortArrow"
                        Grid.Column="1"
                        Width="6"
                        Height="4"
                        Margin="0,0,8,0"
                        VerticalAlignment="Center"
                        Data="M 0 4 L 3.5 0 L 7 4 Z"
                        Fill="{DynamicResource Dark}"
                        RenderTransformOrigin="0.5,0.4"
                        Stretch="Fill"
                        Visibility="Collapsed" />
                    <Thumb
                        x:Name="PART_RightHeaderGripper"
                        Grid.Column="1"
                        HorizontalAlignment="Right"
                        Cursor="SizeWE">
                        <Thumb.Style>
                            <Style TargetType="{x:Type Thumb}">
                                <Setter Property="Width" Value="2" />
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="{x:Type Thumb}">
                                            <Border Background="Transparent" BorderBrush="Transparent" />
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </Thumb.Style>
                    </Thumb>
                </Grid>
                
                <ControlTemplate.Triggers>
                    <Trigger Property="SortDirection" Value="Ascending">
                        <Setter TargetName="SortArrow" Property="Visibility" Value="Visible" />
                        <Setter TargetName="SortArrow" Property="RenderTransform">
                            <Setter.Value>
                                <RotateTransform Angle="180" />
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                    <Trigger Property="SortDirection" Value="Descending">
                        <Setter TargetName="SortArrow" Property="Visibility" Value="Visible" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

有人能告诉我我做的风格哪里出了问题吗?

编辑:

我已将所有元素放在边框内,但这似乎并没有解决它。当我给边框设置不同的厚度时,结果如下:

BorderThickness="0,2,1,4"

边框粗细不同

顶部和底部边框都出现两次。给标题一个 MinHeight 会删除双边框。这似乎不是一个完美的解决方案,但目前有效。

4

1 回答 1

0

我建议您仔细查看原始模板的工作原理。

目前尚不清楚您要实现什么,但您需要两个拇指来调整大小。

在下一页

https://docs.microsoft.com/en-us/dotnet/framework/wpf/controls/datagrid-styles-and-templates

在列标题上搜索,然后循环遍历命中,直到您看到标记如下所示:

<!--Style and template for the DataGridColumnHeader.-->
<Style TargetType="{x:Type DataGridColumnHeader}">
   <Setter Property="VerticalContentAlignment"
         Value="Center" />
   <Setter Property="Template">
     <Setter.Value>
       <ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
    <Grid>
      <Border x:Name="columnHeaderBorder"
              BorderThickness="1"
              Padding="3,0,3,0">
        <Border.BorderBrush>
          <LinearGradientBrush EndPoint="0.5,1"
                               StartPoint="0.5,0">
            <GradientStop Color="{DynamicResource BorderLightColor}"
                          Offset="0" />
            <GradientStop Color="{DynamicResource BorderDarkColor}"
                          Offset="1" />
          </LinearGradientBrush>
        </Border.BorderBrush>
        <Border.Background>
          <LinearGradientBrush EndPoint="0.5,1"
                               StartPoint="0.5,0">
            <GradientStop Color="{DynamicResource ControlLightColor}"
                          Offset="0" />
            <GradientStop Color="{DynamicResource ControlMediumColor}"
                          Offset="1" />
          </LinearGradientBrush>
        </Border.Background>
        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
      </Border>

      <Thumb x:Name="PART_LeftHeaderGripper"
             HorizontalAlignment="Left"
             Style="{StaticResource ColumnHeaderGripperStyle}" />
      <Thumb x:Name="PART_RightHeaderGripper"
             HorizontalAlignment="Right"
             Style="{StaticResource ColumnHeaderGripperStyle}" />
     </Grid>
   </ControlTemplate>
 </Setter.Value>

特别注意:

您需要一个 PART_LeftHeaderGripper 拇指。

两个拇指都使用左右水平对齐排列,这将阻止它们像你的那样填充单元格。

样式中设置了宽度。

作为最后一条建议。

我强烈建议您从标准控件模板的工作副本开始。然后小心地进行小的迭代更改。这样,当它坏了你就知道是什么坏了它。

于 2020-07-18T14:37:28.730 回答