WPF DataGrid 使用数据模板
1. 创建数据模型类
public class TestPointModel
{
public int Id { get; set; }
public string TestPointName { get; set; }
public DateTime TestDateTime { get; set; }
public string Details
{
get
{
return $"{Id} ,{TestPointName} have tested on {TestDateTime}";
}
}
}
2. UI设计
<DataGrid x:Name="dgTestPoints" Margin="5" AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTextColumn Header="ID" Binding="{Binding Id}" Width="50"/>
<DataGridTextColumn Header="PointName" Binding="{Binding TestPointName}" Width="120"/>
<DataGridTextColumn Header="DateTime" Binding="{Binding TestDateTime}" Width="200"/>
</DataGrid.Columns>
<!-- Visibility 属性 Visible,Collapsed,Hidden -->
<DataGrid.RowDetailsTemplate>
<DataTemplate>
<TextBlock Margin=" 10" Visibility="Visible" Text="{Binding Details}"></TextBlock>
</DataTemplate>
</DataGrid.RowDetailsTemplate>
</DataGrid>
使用数据模型类创建数据源，所以AutoGenerateColumns="False"
使用DataGridTextColumn
3.UI 后台代码
public MainWindow()
{
InitializeComponent();
dgTestPoints.ItemsSource = CreatDataSource();
}
//Create Data sorce for DataGrid Control show
private static List<TestPointModel> CreatDataSource()
{
List<TestPointModel> testPoints = new List<TestPointModel>();
testPoints.Add(new TestPointModel() { Id = 1, TestPointName = "VoltageTest", TestDateTime = new DateTime(2022, 7, 23) });
testPoints.Add(new TestPointModel() { Id = 2, TestPointName = "CurrentTest", TestDateTime = new DateTime(2022, 1, 17) });
testPoints.Add(new TestPointModel() { Id = 3, TestPointName = "SwitchTest", TestDateTime = new DateTime(2022, 9, 2) });
return testPoints;
}
创建数据模型的数据集合，绑定到DataGrid 的ItemsSource 属性。
显示效果如下：
