我的模型如下所示:
我想要实现的是,不是让行详细信息以默认方式显示,而是希望它们与父网格列对齐显示。我希望详细信息网格跳过前 3 列(为空白),然后将详细信息与父行的“街道名称”、“街道编号”列对齐。
如果有人能指出我应该研究实现这一目标的属性,那就太好了。
更新:我取得了一些进展,但仍然没有完全通过。我的行显示了我想要的方式,但是在调整列大小时它会中断。我没有发现任何与 Column width changed 或类似的事件相关来编写代码来调整宽度。它是如何在 WPF 中完成的?另外,有没有更好的方法来实现这一点?
xml代码是:
<Window x:Class="AligningDetailsView.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:AligningDetailsView"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525"
DataContext="{Binding RelativeSource={RelativeSource Self}}">
<Window.Resources>
<CollectionViewSource x:Key="customerViewSource"
Source="{Binding Customers}"
d:DesignSource="{d:DesignInstance {x:Type local:Customer}, CreateList=True}" />
</Window.Resources>
<Grid>
<DataGrid x:Name="customerDataGrid"
ItemsSource="{Binding Source={StaticResource customerViewSource}}"
EnableRowVirtualization="True"
AutoGenerateColumns="False" RowDetailsVisibilityMode="VisibleWhenSelected"
Margin="0,27,0.4,-0.2">
<DataGrid.Columns>
<DataGridTextColumn x:Name="firstNameColumn"
Width="100"
Header="First Name"
Binding="{Binding FirstName}" />
<DataGridTextColumn x:Name="lastNameColumn"
Width="100"
Header="Last Name"
Binding="{Binding LastName}" />
<DataGridTextColumn x:Name="phoneColumn"
Width="100"
Header="Age"
Binding="{Binding Age}" />
<DataGridTextColumn x:Name="colStreetNumber"
Width="100"
Header="StreetNumber" />
<DataGridTextColumn x:Name="colStreetName"
Width="100"
Header="StreetNumber" />
<DataGridTextColumn x:Name="colState"
Width="100"
Header="State" />
</DataGrid.Columns>
<DataGrid.RowDetailsTemplate>
<DataTemplate>
<DataGrid ItemsSource="{Binding Addresses}"
RowHeaderWidth="300"
HeadersVisibility="Row"
AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTextColumn x:Name="detail1"
Binding="{Binding StreetNumber}" Width="100" />
<DataGridTextColumn x:Name="detail2"
Width="100" Binding="{Binding StreetName}" />
<DataGridTextColumn x:Name="detail3"
Width="100" Binding="{Binding State}" />
</DataGrid.Columns>
</DataGrid>
</DataTemplate>
</DataGrid.RowDetailsTemplate>
</DataGrid>
</Grid>
后面的代码是:
public partial class MainWindow : Window
{
public MainWindow()
{
Customers = GetCustomers();
InitializeComponent();
}
private List<Customer> GetCustomers()
{
return new List<Customer>()
{
new Customer()
{
FirstName = "James",
LastName = "aka",
Age = 22,
Addresses = new List<Address>()
{
new Address()
{
StreetName = "abdf st",
StreetNumber = 123,
State = "OH"
},
new Address()
{
StreetName = "skdjf abdf st",
StreetNumber = 12233,
State = "OH"
}
}
}
};
}
public List<Customer> Customers { get; set; }
}
public class Customer
{
public string FirstName { get; set; }
public string LastName { get; set; }
public int Age { get; set; }
public List<Address> Addresses { get; set; }
}
public class Address
{
public int StreetNumber { get; set; }
public string StreetName { get; set; }
public string State { get; set; }
}