C# - 在 WPF DataGrid 中删除右边缘行边框

C# - Removing right edge row border in WPF DataGrid

提问by Nick Kitto

I am trying to remove the far right GridLine in a WPF GridView. Here is an example .xaml

我正在尝试删除 WPF GridView 中最右侧的 GridLine。这是一个示例 .xaml

<Window x:Class="Pack.ExampleForm"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Pack"
    Background="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"
    Width="400" Height="300">

    <DataGrid Margin="5" AutoGenerateColumns="False" 
        CanUserReorderColumns="False" HeadersVisibility="Column">

        <DataGrid.Columns>
            <DataGridTextColumn Binding="{x:Null}" CanUserResize="False"/>
            <DataGridTextColumn Binding="{Binding Path=Key}" Header="Request Header" Width="*"/>
            <DataGridTextColumn Binding="{Binding Path=Value}" Header="Value" Width="*"/>
        </DataGrid.Columns>

        <local:RequestHeader Key="Subject 1" Value="Body 1" />
        <local:RequestHeader Key="Subject 1" Value="Body 1" />
    </DataGrid>
</Window>

However this has the far right gridline, as show in the designer, circled in yellow.

然而，这有最右边的网格线，如设计器所示，用黄色圈出。

Is there any way to remove this and have no border, as it is on the left side. Would prefer to do this in the .xaml if possible.

有什么方法可以删除它并且没有边框，因为它在左侧。如果可能，更愿意在 .xaml 中执行此操作。

回答by monstr

Hm, it is just sneaky workaround, but... :)

嗯，这只是偷偷摸摸的解决方法，但是...... :)

<DataGridTextColumn Binding="{Binding Value}" Width="*">
    <DataGridTextColumn.CellStyle>
        <Style TargetType="DataGridCell">
            <Setter Property="Margin" Value="0,0,-1,0"></Setter>
        </Style>
    </DataGridTextColumn.CellStyle>    
</DataGridTextColumn>

回答by Joshua

While @monstr's solution doeswork, it feels like an abuse of the Margin property (it could also make tracking down layout issues more difficult later on). Another solution, which is very similar to the ones suggested by @Nick Sologoub and @Xtr but is slightly cleaner, is to use DataGrid's CellStyle property to modify all cell styles associated with that DataGrid along with DataGrid's GridLinesVisibility property.

虽然@monstr 的解决方案确实有效，但感觉像是滥用了 Margin 属性（它也可能使以后追踪布局问题变得更加困难）。另一种解决方案与@Nick Sologoub 和@Xtr 建议的解决方案非常相似，但更简洁，是使用 DataGrid 的 CellStyle 属性来修改与该 DataGrid 关联的所有单元格样式以及 DataGrid 的 GridLinesVisibility 属性。

<DataGrid GridLinesVisibility="None">
    <DataGrid.CellStyle>
        <Style TargetType="DataGridCell">
            <Setter Property="BorderThickness" Value="1,0,0,1"/>
            <Setter Property="BorderBrush" Value="Black"/>
        </Style>
    </DataGrid.CellStyle>
    <!--Other DataGrid Items-->
</DataGrid>

By styling cells in this manner, you do not affect the layout of controls (whereas messing with the margin does). You also get the benefit of only affecting this one specific DataGrid, and no others in your application. However, if you didwant this style to be applied to all DataGrids in your window, you could put it in your window's resources, or even in your application's resources.

通过以这种方式设置单元格样式，您不会影响控件的布局（而弄乱边距会影响）。您还可以受益于只影响这个特定的 DataGrid，而不会影响您的应用程序中的其他人。但是，如果您确实希望将此样式应用于窗口中的所有 DataGrid，则可以将其放在窗口的资源中，甚至可以放在应用程序的资源中。

<Window>
    <Window.Resources>
        <Style TargetType="DataGrid">
            <Setter Property="GridLinesVisibility" Value="None"/>
        </Style>
        <Style TargetType="DataGridCell">
            <Setter Property="BorderThickness" Value="1,0,0,1"/>
            <Setter Property="BorderBrush" Value="Black"/>
        </Style>
    </Window.Resources>
    <Grid>
        <DataGrid>
            <!--DataGrid Items-->
        </DataGrid>
    </Grid>
</Window>

Notice that the GridLinesVisibility property is also included as it is necesary for this solution to work properly.

请注意，GridLinesVisibility 属性也包括在内，因为它是此解决方案正常工作所必需的。

The proper way to achieve window/application level styling (like above) would most likely include some usage of ResourceDictionaries, but that's a whole different topic.

实现窗口/应用程序级样式（如上）的正确方法很可能包括使用 ResourceDictionaries，但这是一个完全不同的主题。

回答by Nick Sologoub

I did some research, but it doesn't seem like MSFT exposes the properties to modify each specific grid line. So I have a workaround for you. It's not ideal, but it's quite clean and involves no code-behind.

我做了一些研究，但似乎 MSFT 没有公开属性来修改每个特定的网格线。所以我有一个解决方法给你。这并不理想，但它非常干净并且不涉及代码隐藏。

Basically there is a property to control the visibility of grid lines. What you do is hide the vertical ones and then you create a style for cells that will manually create vertical grid lines. You apply that style to every column except for the last one and you get the design you desire.

基本上有一个属性来控制网格线的可见性。您所做的是隐藏垂直的，然后为单元格创建一个样式，该样式将手动创建垂直网格线。您将该样式应用于除最后一列之外的每一列，您将获得所需的设计。

   <Window.Resources>
    <Style x:Key="DataGridCellStyle">
      <Setter Property="DataGridCell.BorderThickness" Value="0 0 1 0" />
      <Setter Property="DataGridCell.BorderBrush" Value="Black" />
    </Style>
  </Window.Resources>
  <Grid>
    <DataGrid x:Name="grid" Margin="5" AutoGenerateColumns="False" CanUserReorderColumns="False" HeadersVisibility="Column" 
        GridLinesVisibility="Horizontal" >
      <DataGrid.Columns>
        <DataGridTextColumn Binding="{x:Null}" CanUserResize="False" CellStyle="{StaticResource DataGridCellStyle}"/>
        <DataGridTextColumn Binding="{Binding Path=Key}" Header="Request Header" Width="*" CellStyle="{StaticResource DataGridCellStyle}"/>
        <DataGridTextColumn Binding="{Binding Path=Value}" Header="Value" Width="*"/>
      </DataGrid.Columns>
    </DataGrid>
  </Grid>

回答by Xtr

Without re-templating the whole DataGrid, you could set the DataGrid's GridLinesVisibility to Horizontal and specify a DataGridCell style that changes each cell's border properties.

无需重新模板化整个 DataGrid，您可以将 DataGrid 的 GridLinesVisibility 设置为 Horizo​​ntal 并指定一个 DataGridCell 样式来更改每个单元格的边框属性。

<DataGrid Margin="5"
          AutoGenerateColumns="False"
          CanUserReorderColumns="False" 
          HeadersVisibility="Column"
          GridLinesVisibility="Horizontal"
          ItemsSource="{Binding SomeDictionary}">
      <DataGrid.Resources>
        <Style TargetType="DataGridCell">
          <Setter Property="BorderThickness" Value="1,0,0,0"/>
          <Setter Property="BorderBrush" Value="Black"/>
        </Style>
      </DataGrid.Resources>
      <DataGrid.Columns>
        <DataGridTextColumn Binding="{x:Null}" CanUserResize="False"/>
        <DataGridTextColumn Binding="{Binding Path=Key}" Header="Request Header" Width="*"/>
        <DataGridTextColumn Binding="{Binding Path=Value}" Header="Value" Width="*"/>
      </DataGrid.Columns>
    </DataGrid>

Then you will only see the actual DataGrid's border, which you can remove with BorderThickness="1,1,0,1"on the DataGrid if you want.

然后您将只看到实际的 DataGrid 的边框，BorderThickness="1,1,0,1"如果需要，您可以在 DataGrid 上将其删除。

回答by Bob H

The solution I have found uses a Grid instead of a DataGrid. I wrap each cell in a border with a BorderThickness="a,b,c,d" where:

我找到的解决方案使用 Grid 而不是 DataGrid。我用 BorderThickness="a,b,c,d" 将每个单元格包裹在一个边框中，其中：

a = Left Border
b = Top Border
c = Right Border
d = Bottom Border

Any one(s) that I don't want to see get set to 0. If I use a particular one over and over, I set a Style and reuse that.

我不想看到的任何一个都设置为 0。如果我一遍又一遍地使用特定的样式，我会设置一个样式并重复使用它。

回答by Kirill Shur

May be this will help:

可能这会有所帮助：

this solved for me edge problem in WPF DataGrid. Just put "0" to RowHeaderWidth property

这为我解决了 WPF DataGrid 中的边缘问题。只需将“0”放入 RowHeaderWidth 属性

回答by J R B

IF you want to remove whole Grid cell border then can use GridLinesVisibility="None". else below is the solution to remove single border.

如果要删除整个 Grid 单元格边框，则可以使用GridLinesVisibility="None"。下面是删除单个边框的解决方案。

Removing all DataGrid row and cell borders

删除所有 DataGrid 行和单元格边框

回答by Dinesh Kumar P

1) Create a style for TextBox customizing BorderThicknessproperty (2,2,0,2).

1) 为 TextBox 创建一个样式，自定义BorderThickness属性 (2,2,0,2)。

2) Add the style within the last DataGridColumn.

2) 在最后一个 DataGridColumn 中添加样式。

So that the last column's TextBox border alone would result with the required change.

因此，仅最后一列的 TextBox 边框就会导致所需的更改。