1

我的模型如下所示:

在此处输入图像描述

我想要实现的是,不是让行详细信息以默认方式显示,而是希望它们与父网格列对齐显示。我希望详细信息网格跳过前 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; }
}
4

1 回答 1

0

您可以删除行标题,即子行左侧的小间隙:

<DataGrid RowHeaderWidth="50" ... >
于 2016-04-11T22:44:40.110 回答