wpf中的数据网格中的列行不同步

Question

我添加了一个数据网格控件来显示员工详细信息并与 ObservableCollection 绑定。 我根据国家对数据进行了分组。 但现在的问题是，列标题的垂直线（分隔列的线）与列数据不同步。（网格数据部分中的行相对于标题行略微向右移动。）

如果我删除组标题，则列标题垂直行与列数据同步。 是否有任何属性可以将行与整列同步？

下面是xaml代码

 <Grid>
        <Custom:DataGrid x:Name="dgData" CanUserAddRows="False" AutoGenerateColumns="False" HeadersVisibility="Column"
                         CanUserDeleteRows="False" ItemsSource="{Binding}">
            <Custom:DataGrid.GroupStyle>
                <GroupStyle >
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>

                            <DockPanel Background="LightBlue">
                                <TextBlock Text="{Binding Name}" Foreground="Blue" Margin="30,0,0,0" Width="100"/>

                            </DockPanel>
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                </GroupStyle>
            </Custom:DataGrid.GroupStyle>
            <Custom:DataGrid.Columns>
                <Custom:DataGridTextColumn Header="Name" Binding="{Binding Name}"/>
                <Custom:DataGridTextColumn Header="Contact" Binding="{Binding Contact}"/>
                <Custom:DataGridTextColumn Header="Email ID" Binding="{Binding EmailID}"/>
                <Custom:DataGridTextColumn Header="Country" Binding="{Binding Country}"/>
            </Custom:DataGrid.Columns>
        </Custom:DataGrid>
    </Grid>

below is code behind file

     public Window1()
        {
            InitializeComponent();
            ObservableCollection<Employee> empData = new ObservableCollection<Employee> 
            {
                new Employee{Name="Diptimaya Patra", Contact="0000", 
                    EmailID="diptimaya.patra@some.com", Country="India"},
                new Employee{Name="Dhananjay Kumar", Contact="00020", 
                    EmailID="dhananjay.kumar@some.com", Country="India"},
                new Employee{Name="David Paul", Contact="1230", 
                    EmailID="david.paul@some.com", Country="India"},
                new Employee{Name="Christina Joy", Contact="1980", 
                    EmailID="christina.joy@some.com", Country="UK"},
                new Employee{Name="Hiro Nakamura", Contact="0000", 
                    EmailID="hiro.nakamura@some.com", Country="Japan"},
                new Employee{Name="Angela Patrelli", Contact="0000", 
                    EmailID="angela.patrelli@some.com", Country="Japan"},
                new Employee{Name="Zoran White", Contact="0000", 
                    EmailID="diptimaya.patra@some.com", Country="Scotland"},
            };

            ListCollectionView collection = new ListCollectionView(empData);
            collection.GroupDescriptions.Add(new PropertyGroupDescription("Country"));
            dgData.ItemsSource = collection;
        }

Answer 1

是的，你也必须设置GroupStyle.ContainerStyle 属性。

我已通过以下方式修改了您的代码。

<DataGrid x:Name="dgData" CanUserAddRows="False" AutoGenerateColumns="False" HeadersVisibility="Column"
                 CanUserDeleteRows="False" ItemsSource="{Binding}">
    <DataGrid.GroupStyle>
        <GroupStyle>
            <GroupStyle.ContainerStyle>
                <Style TargetType="{x:Type GroupItem}">
                    <Setter Property="Margin" Value="0,0,0,0"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type GroupItem}">
                                <DockPanel Background="LightBlue">
                                    <TextBlock Text="{Binding Name}" Foreground="Blue" Margin="30,0,0,0" Width="100" DockPanel.Dock="Top"/>
                                    <ItemsPresenter />
                                </DockPanel>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </GroupStyle.ContainerStyle>
        </GroupStyle>
    </DataGrid.GroupStyle>
    <DataGrid.Columns>
        <DataGridTextColumn Header="Name" Binding="{Binding Name}"/>
        <DataGridTextColumn Header="Contact" Binding="{Binding Contact}"/>
        <DataGridTextColumn Header="Email ID" Binding="{Binding EmailID}"/>
        <DataGridTextColumn Header="Country" Binding="{Binding Country}"/>
    </DataGrid.Columns>
</DataGrid>

或者

你也可以这样使用。

 <StackPanel Background="LightBlue" Orientation="Vertical">
     <TextBlock Text="{Binding Name}" Foreground="Blue" Margin="30,0,0,0" Width="100"/>
     <ItemsPresenter />
 </StackPanel>