StackedHeaderRows not working as expected

[BAO YADONG]

Hi,

I have refer to your documentation of StackedHeaderRows sample, but i can't get this feature to work properly.

<sync:SfGrid>

...

<sync:SfDataGrid.StackedHeaderRows>

<sync:StackedHeaderRow>

<sync:StackedHeaderRow.StackedColumns>

<sync:StackedColumn ChildColumns="PatientID, PatientName" HeaderText="Employee Details"/>

</sync:StackedHeaderRow.StackedColumns>

</sync:StackedHeaderRow>

</sync:SfDataGrid.StackedHeaderRows>

<sync:SfDataGrid.Columns>

<sync:GridTextColumn HeaderText="Visit Date" MappingName="VisitDate" TextAlignment="Left" Width="100">

...

</sync:GridTextColumn>

<sync:GridTextColumn HeaderText="Patient ID" MappingName="PatientID" TextAlignment="Left" Width="100">

<sync:GridTextColumn.CellTemplate>

<DataTemplate>

<Border >

<TextBlock Padding="3,0,0,0" FontWeight="Regular" FontSize="13" Text="{Binding Path=ID}" VerticalAlignment="Center"/>

</Border>

</DataTemplate>

</sync:GridTextColumn.CellTemplate>

</sync:GridTextColumn>

<sync:GridTextColumn HeaderText="Patient Name" MappingName="PatientName" TextAlignment="Left" Width="100">

...

</sync:GridTextColumn>

<sync:GridTextColumn HeaderText="Diagnosis" MappingName="Diagnosis" TextAlignment="Left" Width="100">

...

</sync:GridTextColumn>

</sync:SfDataGrid.Columns>

</sync:SfGrid>

My final grid look so weird that it has a line in between 2 rows. Please see the attached image.

I have not try the GroupName option, but do i need to specify the StackedHeaderRows if i'm using the GroupName option?

Attachment: Capture_3815dd8d.rar

[Gnanasownthari Thirugnanam]

Hi BAO, 

On analyzing your given screenshot we suspect that you are applying style for GridHeaderCellControl and HeaderRowControl. But this is incorrect use case as per our control design so you need to write style for GridStackedHeaderCellControl and GridHeaderCellControl as like below code example. 

XAML 

<Window.Resources> 

    <Style TargetType="syncfusion:GridStackedHeaderCellControl">             

       <Setter Property="BorderBrush" Value="SkyBlue"/> 

    </Style> 

    <Style TargetType="syncfusion:GridHeaderCellControl"> 

       <Setter Property="BorderBrush" Value="SkyBlue"/> 

    </Style> 

</Window.Resources> 

We have prepared the sample for same, you can download the same from below mentioned location. 

Sample location: 

http://www.syncfusion.com/downloads/support/directtrac/general/ze/SfDataGridDemo1599794726.zip 

Please refer the below UG link for more details about SfDataGrid control design. 

https://help.syncfusion.com/wpf/sfdatagrid/styles-and-templates#control-structure-of-sfdatagrid 

Please let us know if you have any further assistance on this. 

Regards, 

Gnanasownthari T.