Question

我创建了一个带有一点自定义的数据网格。最后一个列标题由通常的文本块加上一个带有旋转文本的堆栈面板组成。

为了让它看起来更好，我制作了前6列高25，底部垂直对齐，否则它们会拉伸到顶部。

enter image description here

我的第二张图片显示我可以重新排序最后一列。 enter image description here

但是我不能重新订购前六个中的任何一个。

在下一个图片（左）中，我完全删除了垂直对齐，使其默认位于中心，（右）我将垂直对齐设置为顶部。 enter image description here

正如您所看到的，必须有另一级别的组件，您不能只改变DataGridColumnHeader样式并期望通过拖动重新排序。

问题：

我需要在我的样式中添加什么才能将可拖动性放在底部的较低DataGridColumnHeaders，就像在第一张图片中一样？
如何找到此约束？我可以以某种方式遍历列出它们的标题元素吗？
最后，柱子的透明浮动拖动图像与顶部对齐，我想将其放在底部，并带有实际的标题标签，该怎么办？

这是我的XAML代码：

<Window x:Class="DGTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="250" Width="500">

    <Window.Resources>
        <Style TargetType="DataGridColumnHeader">
            <Setter Property="Background" Value="Transparent"/>
        </Style>
        <Style x:Key="ColumnHeaderStyle" TargetType="DataGridColumnHeader">
            <Setter Property="Height" Value="25" />
            <Setter Property="VerticalAlignment" Value="Bottom"/>
        </Style>

    </Window.Resources>

    <Grid Name="gridUsers" Background="Transparent">
        <DockPanel Background="Transparent">
            <DataGrid Background="Transparent" CanUserReorderColumns="True" AutoGenerateColumns="False" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
                <DataGrid.Columns>
                    <DataGridTextColumn Header="ID" CanUserReorder="True" IsReadOnly="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" Binding="{Binding Path=User_ID}"/>
                    <DataGridTextColumn Header="Name" CanUserReorder="True" CanUserSort="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" Binding="{Binding Path=Name}"/>
                    <DataGridTextColumn Header="Username" CanUserReorder="True" CanUserSort="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" Binding="{Binding Path=Username}"/>
                    <DataGridTextColumn Header="Job Title" CanUserReorder="True" CanUserSort="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" Binding="{Binding Path=Job_Title}"/>
                    <DataGridTextColumn Header="Department" CanUserReorder="True" CanUserSort="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" Binding="{Binding Path=Department}"/>
                    <DataGridTextColumn Header="Company" CanUserReorder="True" CanUserSort="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" Binding="{Binding Path=Company}"/>
                    <DataGridTemplateColumn CanUserReorder="True" CanUserSort="False" >
                        <DataGridTemplateColumn.Header>
                            <StackPanel Orientation="Vertical" Background="Transparent" HorizontalAlignment="Center">
                                <Label Background="AliceBlue" HorizontalAlignment="Stretch" Height="25" VerticalContentAlignment="Center" HorizontalContentAlignment="Center" >
                                    Access
                                </Label>
                                <StackPanel Orientation="Horizontal" Background="Transparent" CanVerticallyScroll="False" CanHorizontallyScroll="False">
                                    <TextBlock Text="Read" Width="80" Margin="20,1,0,1" >
                                        <TextBlock.LayoutTransform>
                                          <RotateTransform Angle="-60"/>
                                        </TextBlock.LayoutTransform>
                                    </TextBlock>
                                    <TextBlock Text="Write" Width="80" Margin="-15,1,0,1" >
                                        <TextBlock.LayoutTransform>
                                          <RotateTransform Angle="-60"/>
                                        </TextBlock.LayoutTransform>
                                    </TextBlock>
                                    <TextBlock Text="Administrator" Width="80" Margin="-15,1,0,1" >
                                        <TextBlock.LayoutTransform>
                                          <RotateTransform Angle="-60"/>
                                        </TextBlock.LayoutTransform>
                                    </TextBlock>
                                </StackPanel>
                            </StackPanel>
                        </DataGridTemplateColumn.Header>
                    </DataGridTemplateColumn>
                </DataGrid.Columns>
            </DataGrid>
        </DockPanel>
    </Grid>
</Window>

Answer 1

我尝试通过以下更改来满足您的要求。更改ColumnHeaderStyle，如下所示。我刚刚给出了原始样式的列标题，并进行了以下更改。根据您的应用需求进行更改。

  <Style TargetType="DataGridColumnHeader">
        <Setter Property="Background" Value="Transparent"/>
    </Style>

 <Style x:Key="ColumnHeaderStyle" TargetType="{x:Type DataGridColumnHeader}">
        <Setter Property="VerticalContentAlignment" Value="Bottom"/>
        <Setter Property="VerticalAlignment" Value="Stretch"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="DataGridColumnHeader">
                    <Grid>
                    <Border Background="Gray" VerticalAlignment="Bottom" Margin="1">
                        <ContentPresenter Content="{TemplateBinding Content}" Margin="5" VerticalAlignment="Bottom"/>
                    </Border>
                    <Thumb x:Name="PART_LeftHeaderGripper" HorizontalAlignment="Left">
                        <Thumb.Style>
                            <Style TargetType="{x:Type Thumb}">
                                <Setter Property="Width" Value="8"/>
                                <Setter Property="Background" Value="Transparent"/>
                                <Setter Property="Cursor" Value="SizeWE"/>
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="{x:Type Thumb}">
                                            <Border Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}"/>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </Thumb.Style>
                    </Thumb>
                    <Thumb x:Name="PART_RightHeaderGripper" HorizontalAlignment="Right">
                        <Thumb.Style>
                            <Style TargetType="{x:Type Thumb}">
                                <Setter Property="Width" Value="8"/>
                                <Setter Property="Background" Value="Transparent"/>
                                <Setter Property="Cursor" Value="SizeWE"/>
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="{x:Type Thumb}">
                                            <Border Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}"/>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </Thumb.Style>
                    </Thumb>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

还设置所有列的DragIndicatorStyle，如下所示。

 <Style x:Key="DragIndicatorStyle" TargetType="Control">
        <Setter Property="Height" Value="75"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="Margin" Value="0,-25,0,0"/>
        <Setter Property="VerticalAlignment" Value="Bottom"/>
        <Setter Property="VerticalContentAlignment" Value="Bottom"/>                   
    </Style>

Answer 2

我认为你的问题是让Header只有25个高位移除了正确的拖放目标，这就是它无法正常工作的原因。

在每一行上放置一个自定义标题似乎可以提供您想要的行为。在这种情况下，当它被包裹在网格中时，有一个控件填充整个空间，因此拖放可以正常工作。（标题的样式可以移动到我认为的样式，而不是在每列上重复它）。我认为必须有一个更好的方法，而不是给堆栈面板大小90，但我现在找不到更好的方法。

<DataGridTextColumn CanUserReorder="True" CanUserSort="True" Binding="{Binding Path=Company}">
    <DataGridTextColumn.Header>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"></RowDefinition>
                <RowDefinition Height="25"></RowDefinition>
            </Grid.RowDefinitions>
            <StackPanel Height="90"  Grid.Row="0"/>
            <TextBlock Height="25" Grid.Row="1">Access</TextBlock>
        </Grid>
    </DataGridTextColumn.Header>                        
</DataGridTextColumn>

如何使列重新排序在datagrid中工作

2 个答案: