我添加了一个数据网格控件来显示员工详细信息并与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;
}
答案 0 :(得分:2)
是的,你也必须设置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>