Question

有没有办法在DataGrid中的两个特定列之间创建可视化分隔符？它不需要花哨，可能只是一条双线或更厚的边框。

Answer 1

如果是这样的话

enter image description here

您可以使用自定义样式：

<Window.Resources>
    <Style x:Key="DataGridColumnSeparatorStyle" TargetType="DataGridCell">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                    <Rectangle VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Fill="Gray"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

<DataGrid x:Name="dataGrid" AutoGenerateColumns="False">        
    <DataGrid.Columns>
        <DataGridTextColumn Header="Start"/>
        <DataGridTextColumn Header="End"/>
        <!-- Separator column -->
        <DataGridTemplateColumn MinWidth="0" Width="2" CellStyle="{StaticResource DataGridColumnSeparatorStyle}"/>
        <DataGridTextColumn Header="Start"/>
        <DataGridTextColumn Header="End"/>
    </DataGrid.Columns>
</DataGrid>

如果您通过自动生成列或其他方法在代码隐藏中生成列，您仍然可以通过从XAML获取资源来创建分隔符列：

DataGridTextColumn s1 = new DataGridTextColumn() { Header = "Start" };
DataGridTextColumn s2 = new DataGridTextColumn() { Header = "Start" };
DataGridTextColumn e1 = new DataGridTextColumn() { Header = "End" };
DataGridTextColumn e2 = new DataGridTextColumn() { Header = "End" };

DataGridTemplateColumn column = new DataGridTemplateColumn();
column.MinWidth = 0;
column.Width = 2;

var separatorStyle = (Style)FindResource("DataGridColumnSeparatorStyle");
column.CellStyle = separatorStyle;

dataGrid.Columns.Add(s1);
dataGrid.Columns.Add(e1);
dataGrid.Columns.Add(column);
dataGrid.Columns.Add(s2);
dataGrid.Columns.Add(e2);

Answer 2

我认为你有两种选择。最简单的选项可能是使用Style并将DataGrid.CellStyle设置为已定义的样式。

    <Style x:Key="DataGridBorder" TargetType="DataGridCell">
        <Setter Property="BorderBrush" Value="LightGray" />
        <Setter Property="BorderThickness" Value="1,1,1,1" />          
    </Style>
    ...
    <DataGrid CellStyle="{StaticResource DataGridBorder}">
    ...

另一种选择是将CellTemplate与DataGridTemplateColumn结合使用。

    <DataGridTemplateColumn>
        <DataGridTemplateColumn.CellTemplate>
            <DataTemplate>
                <Border BorderBrush="LightGray" BorderThickness="1,1,1,1" Margin="-6,-6,-6,-6">
                    <Grid Margin="6,6,6,6">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />                                                    
                        </Grid.ColumnDefinitions>
                        <TextBlock Text="{Binding Whatever}" Grid.Column="0" TextTrimming="CharacterEllipsis" VerticalAlignment="Center" />
                    </Grid>                                            
                </Border>
            </DataTemplate> 
        </DataGridTemplateColumn.CellTemplate>
    </DataGridTemplateColumn>

我没有测试其中任何一个，你可能需要稍微玩一下边距。

Answer 3

试试这个。使用键盘Tab键在单元格中导航时，它不会聚焦分隔符列：

<DataGridTemplateColumn MinWidth="2" MaxWidth="2" IsReadOnly="True" CanUserResize="False">
    <DataGridTemplateColumn.HeaderStyle>
        <Style TargetType="{x:Type DataGridColumnHeader}">
            <Setter Property="Background" Value="Gray" />
            <Setter Property="BorderBrush" Value="Gray" />
            <Setter Property="BorderThickness" Value="2" />
        </Style>
    </DataGridTemplateColumn.HeaderStyle>
    <DataGridTemplateColumn.CellStyle>
        <Style TargetType="{x:Type DataGridCell}">                       
            <Setter Property="BorderBrush" Value="Gray" />
            <Setter Property="BorderThickness" Value="2" />                          
            <Setter Property="Focusable" Value="False" />
        </Style>
    </DataGridTemplateColumn.CellStyle>
</DataGridTemplateColumn>

Source

创建DataGrid列分隔符

3 个答案: