在 WPF 中使用 DataGrid 控件时，可能会遇到一个额外的列显示在 DataGrid 的末尾。这通常发生在 DataGrid 的 ItemsSource 属性绑定了数据源，而此列并不是数据源的一部分。本文将讲解如何解决这一问题，使 DataGrid 只显示需要的列。
一. 创建 WPF 应用程序
首先，我们需要创建一个 WPF 应用程序并添加一个 DataGrid 控件。
1. 创建项目
-
打开 Visual Studio。 -
创建一个新的 WPF 应用程序项目。
2. 添加 DataGridWindow.xaml
-
在项目中添加一个新的 XAML 文件，命名为 DataGridWindow.xaml。 -
在 DataGridWindow.xaml文件中添加 DataGrid 控件。
二. 添加 DataGrid 控件
1. 在 XAML 文件中定义 DataGrid 控件
在 DataGridWindow.xaml 文件中，添加以下代码来定义 DataGrid 控件：
<Window x:Class="MVVMLightSample_DotNetCore8.View.DataGridWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DataGridWindow" Height="350" Width="525">
<Grid>
<DataGrid x:Name="Datagrid1" AutoGenerateColumns="True" />
Grid>
Window>
2. 添加后端代码以显示数据
在 DataGridWindow.xaml.cs 文件中，添加以下代码来加载数据并绑定到 DataGrid：
namespace MVVMLightSample_DotNetCore8.View
{
///
/// DataGridWindow.xaml 的交互逻辑
///
public partial class DataGridWindow : Window
{
public DataGridWindow()
{
InitializeComponent();
LoadData();
}
private void LoadData()
{
// 创建产品列表
List product = new List
{
new Product { ProductID = 1, ProductName = "Laptop", ProductDescription = "Dell Laptop", ProductPrice = 50000, ProductStock = 10 },
new Product { ProductID = 2, ProductName = "Mobile", ProductDescription = "Samsung Mobile", ProductPrice = 20000, ProductStock = 20 },
new Product { ProductID = 3, ProductName = "Tablet", ProductDescription = "Lenovo Tablet", ProductPrice = 15000, ProductStock = 30 },
new Product { ProductID = 4, ProductName = "Desktop", ProductDescription = "HP Desktop", ProductPrice = 40000, ProductStock = 40 },
new Product { ProductID = 5, ProductName = "Printer", ProductDescription = "Canon Printer", ProductPrice = 10000, ProductStock = 50 },
new Product { ProductID = 6, ProductName = "Scanner", ProductDescription = "Epson Scanner", ProductPrice = 8000, ProductStock = 60 },
new Product { ProductID = 7, ProductName = "Keyboard", ProductDescription = "Logitech Keyboard", ProductPrice = 500, ProductStock = 70 },
new Product { ProductID = 8, ProductName = "Mouse", ProductDescription = "Dell Mouse", ProductPrice = 300, ProductStock = 80 }
};
// 将产品列表绑定到 DataGrid 控件
Datagrid1.ItemsSource = product;
}
}
}
三. 解决额外列问题
1. 额外列的出现原因
在上述代码中，即使数据库表或模型类只有 5 列，DataGrid 控件可能会显示第 6 列。这个额外的列通常是因为 DataGrid 的默认行为和列宽设置。
2. 解决方案
要去除 DataGrid 中的额外列，我们可以在 XAML 中为 DataGrid 添加一个属性 ColumnWidth="*"。这样，DataGrid 会根据数据自动调整列宽，而不再显示额外的列。
在 DataGridWindow.xaml 中，修改 DataGrid 控件的定义如下：
<Window x:Class="MVVMLightSample_DotNetCore8.View.DataGridWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DataGridWindow" Height="350" Width="525">
<Grid>
<DataGrid x:Name="Datagrid1" AutoGenerateColumns="True" ColumnWidth="*" />
Grid>
Window>
3. 重新构建并运行
重新构建项目并运行，您会发现 DataGrid 现在已经不再显示额外的列，数据也会完全填充到 DataGrid 中。
四. 总结
通过在 DataGrid 控件中设置 ColumnWidth="*" 属性，可以有效地解决额外列的问题。这个简单的设置帮助 DataGrid 自动调整列宽，确保显示的数据不会多出额外的列。