0

我有一个已冻结第一列的 DataGrid。我试图使冻结的列看起来像一个单独的 DataGrid。我想在冻结列之后增加网格线，使其看起来像我制作的下图。我不确定如何在冻结列之后增加网格线宽度。

在此处输入图像描述

  <DockPanel Name="dpHistory" LastChildFill="True" sl:UIAudit.Drsarea="SuperBillHistory">
<Border Background="Blue" Grid.Column="3"/>
<DataGrid Name="dgData" CanUserAddRows="False" 
          Style="{DynamicResource DataGridRow}" 
          CellStyle="{StaticResource DataGridCellStyle}"
                  AutoGenerateColumns="False"
                         CanUserReorderColumns="False"
                         IsReadOnly="True"
                         EnableRowVirtualization="True"
                         EnableColumnVirtualization="True"
                         AlternationCount="2"
                         AlternatingRowBackground="LightSteelBlue"
                         CanUserSortColumns="False"
                         FrozenColumnCount="2"
                          BorderThickness="5">       
</DataGrid>
4

1 回答 1

1

作为使单个列“冻结”并在其右侧提供令人愉悦的装订线的策略的替代方案，您可以考虑使用由装订线分隔的两个数据网格的策略。在这种情况下，并按照您的评论，它会给您一些东西，这里有一些 Xaml 来看看...... 在此处输入图像描述

<Grid>
    <StackPanel Orientation="Horizontal">
        <StackPanel.Resources>
            <system:Double x:Key="HeaderHeight">26</system:Double>
            <LinearGradientBrush x:Key="GutterBrush" StartPoint="0,0" EndPoint="1,0">
                <GradientStop Color="DarkGray" Offset="0"/>
                <GradientStop Color="LightGray" Offset="1"/>
            </LinearGradientBrush>
        </StackPanel.Resources>
        <DataGrid Name="LeftMost"
                  Background="PaleTurquoise"
                  HeadersVisibility="Column"
                  ItemsSource="{Binding LeftHeaders}"
                  AutoGenerateColumns="False"
                  >
            <DataGrid.Columns>
               <DataGridTemplateColumn CanUserReorder="False" CanUserResize="False">
                   <DataGridTemplateColumn.Header>
                       <TextBlock Height="{StaticResource HeaderHeight}" Text=""/>
                   </DataGridTemplateColumn.Header>
                    <DataGridTemplateColumn.HeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="Background" Value="RosyBrown"/>
                            <Setter Property="Height" Value="{StaticResource HeaderHeight}"/>
                        </Style>
                    </DataGridTemplateColumn.HeaderStyle>
                    <DataGridTemplateColumn.CellTemplate>
                       <DataTemplate>
                           <TextBlock Width="70" Text="{Binding .}" Background="LightBlue"/>
                       </DataTemplate>
                   </DataGridTemplateColumn.CellTemplate>
               </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>
        <Rectangle Width="5" Fill="{StaticResource GutterBrush}"/>
        <DataGrid Name="RightMost"
                  Background="PowderBlue"
                  GridLinesVisibility="All"
                  >
            <DataGrid.Columns>
                <DataGridTextColumn Header="Column 1" >
                    <DataGridTextColumn.HeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="Height" Value="{StaticResource HeaderHeight}"/>
                        </Style>
                    </DataGridTextColumn.HeaderStyle>
                </DataGridTextColumn>
                <DataGridTextColumn Header="Column 2" >
                    <DataGridTextColumn.HeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="Height" Value="{StaticResource HeaderHeight}"/>
                        </Style>
                    </DataGridTextColumn.HeaderStyle>
                </DataGridTextColumn>
                <DataGridTextColumn Header="Column 3" >
                    <DataGridTextColumn.HeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="Height" Value="{StaticResource HeaderHeight}"/>
                        </Style>
                    </DataGridTextColumn.HeaderStyle>
                </DataGridTextColumn>
            </DataGrid.Columns>
        </DataGrid>
    </StackPanel>
</Grid>

这个片段有很多不同的颜色，所以你可以更快地找到哪个元素做什么。但如图所示，它是一个包含两个 DataGrid 和一个 Rectangle 的 Stack Panel。如上所述，您需要将细致的样式分成两部分，并将它们分别应用于两个 DataGrid。如果您需要同步选择和/或滚动，您可以使用绑定，但这是另一天的另一个问题。:)

此外，如果将第一个 DataGrid 设置为 CanUserResizeColumns，则可以水平拖动大小并给出拆分器的效果。

这种方法提供了您所追求的视觉体验，并且在实现上比原来的方法更直接。一旦实现了整个事情，您可能可以返回并将所有位应用到控制模板。我会将这种方法添加到我自己的技巧包中。

于 2013-07-17T14:33:34.833 回答