We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Summary row breaking line

Hi,
I'am developing an app in which I have SfDataGrid with different columns. To one of those columns I created a cutom aggregation to summarize data depending on second column type. Example:

4Type A
5Type B
3Type B
A(4), B(8)

However, if there is more types the grid starts to look to wide. Is there a way to brake line in GridSummaryRow for it to look more like:

A(4),
B(8),
C(1),
D(22)




4 Replies

DM Dhanasekar Mohanraj Syncfusion Team November 17, 2022 10:20 AM

You can achieve your requirement by updating the summary row height using SfDataGrid.QueryRowHeight event shown below,

this.sfDataGrid1.QueryRowHeight += OnQueryRowHeight;

void OnQueryRowHeight(object sender, QueryRowHeightEventArgs e)

{

    //checked whether the row index is a table summary row or not.

    if (sfDataGrid1.TableControl.IsTableSummaryIndex(e.RowIndex))

    {

        e.Height = 50;

        e.Handled = true;

    }

}

For more information related to the QueryRowHeight event, please refer to the below user guide documentation link,

UG Link: https://help.syncfusion.com/windowsforms/datagrid/rowheightcustomization#change-tablesummaryrow-height 

We have prepared the sample based on your scenario. Please have a look at this. If we misunderstood your requirement, please provide more information regarding the requirement. This would help us to proceed further.


If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Attachment: SfDatagridDemo_7c6da2b.zip


CH Chris November 21, 2022 03:26 AM

Hi,
this allow me to only change row size to fixed value. Is there any way to auto-adjust row height depending on the text inside row? I tried using GetAutoRowHeight but it does not works for summary row.

        void dataGrid_QueryRowHeight(object sender, QueryRowHeightEventArgs e)
GridRowSizingOptions gridRowResizingOptions = new GridRowSizingOptions();
            double autoHeight;
            if (this.AssociatedObject.IsTableSummaryIndex(e.RowIndex))
            {
                if (!this.AssociatedObject.GridColumnSizer.GetAutoRowHeight(e.RowIndex, gridRowResizingOptions, out autoHeight))
                {
                    if (autoHeight > 24)
                    {
                        e.Height = autoHeight;
                        e.Handled = true;
                    }
                }
            }
        }



DM Dhanasekar Mohanraj Syncfusion Team November 21, 2022 11:30 AM

Chris,

Currently, we are checking the feasibility to achieve your requirement on our end. We will check and update you with further details on November 24, 2022.



DM Dhanasekar Mohanraj Syncfusion Team November 24, 2022 12:55 PM

Chris,

You can achieve your requirement to set the table summary row height based on its content will be achievable by overriding the table summary row style and using the SfDataGrid.QueryRowHeight event shown below,

XAML:


<
Window.Resources>

    <Style TargetType="{x:Type syncfusion:GridTableSummaryCell}">

        <Style.BasedOn>

            <Style TargetType="{x:Type syncfusion:GridTableSummaryCell}">

                <Setter Property="Background" Value="Transparent"/>

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

                <Setter Property="BorderThickness" Value="0"/>

                <Setter Property="Padding" Value="3,0"/>

                <Setter Property="IsTabStop" Value="False"/>

                <Setter Property="VerticalContentAlignment" Value="Center"/>

            </Style>

        </Style.BasedOn>

        <Style.Triggers>

            <Trigger Property="UseDrawing" Value="True">

                <Setter Property="BorderThickness" Value="1"/>

                <Setter Property="Template">

                    <Setter.Value>

                        <ControlTemplate TargetType="{x:Type syncfusion:GridTableSummaryCell}">

                            <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

                        </ControlTemplate>

                    </Setter.Value>

                </Setter>

            </Trigger>

            <Trigger Property="UseDrawing" Value="False">

                <Setter Property="Template">

                    <Setter.Value>

                        <ControlTemplate TargetType="{x:Type syncfusion:GridTableSummaryCell}">

                            <Border x:Name="PART_GridTableSummaryCellBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">

                                <VisualStateManager.VisualStateGroups>

                                    <VisualStateGroup x:Name="BorderStates">

                                        <VisualState x:Name="NormalCell"/>

                                        <VisualState x:Name="LastColumnCell">

                                            <Storyboard BeginTime="0">

                                                <ThicknessAnimationUsingKeyFrames BeginTime="0" Duration="1.0:0:0" Storyboard.TargetProperty="BorderThickness" Storyboard.TargetName="PART_GridTableSummaryCellBorder">

                                                    <EasingThicknessKeyFrame KeyTime="0" Value="0,0,1,0"/>

                                                </ThicknessAnimationUsingKeyFrames>

                                            </Storyboard>

                                        </VisualState>

                                        <VisualState x:Name="HorizontalLastColumnCell">

                                            <Storyboard BeginTime="0">

                                                <ThicknessAnimationUsingKeyFrames BeginTime="0" Duration="1.0:0:0" Storyboard.TargetProperty="BorderThickness" Storyboard.TargetName="PART_GridTableSummaryCellBorder">

                                                    <EasingThicknessKeyFrame KeyTime="0" Value="0"/>

                                                </ThicknessAnimationUsingKeyFrames>

                                            </Storyboard>

                                        </VisualState>

                                        <VisualState x:Name="VerticalLastColumnCell">

                                            <Storyboard BeginTime="0">

                                                <ThicknessAnimationUsingKeyFrames BeginTime="0" Duration="1.0:0:0" Storyboard.TargetProperty="BorderThickness" Storyboard.TargetName="PART_GridTableSummaryCellBorder">

                                                    <EasingThicknessKeyFrame KeyTime="0" Value="0,0,1,0"/>

                                                </ThicknessAnimationUsingKeyFrames>

                                            </Storyboard>

                                        </VisualState>

                                        <VisualState x:Name="NoneLastColumnCell">

                                            <Storyboard BeginTime="0">

                                                <ThicknessAnimationUsingKeyFrames BeginTime="0" Duration="1.0:0:0" Storyboard.TargetProperty="BorderThickness" Storyboard.TargetName="PART_GridTableSummaryCellBorder">

                                                    <EasingThicknessKeyFrame KeyTime="0" Value="0"/>

                                                </ThicknessAnimationUsingKeyFrames>

                                            </Storyboard>

                                        </VisualState>

                                    </VisualStateGroup>

                                </VisualStateManager.VisualStateGroups>

                                <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" >

                                    <ContentPresenter.Content >

                                        <TextBlock Text="{TemplateBinding Content}" TextWrapping="Wrap" />

                                    </ContentPresenter.Content>

                                </ContentPresenter>

                            </Border>

                        </ControlTemplate>

                    </Setter.Value>

                </Setter>

            </Trigger>

        </Style.Triggers>

    </Style>

</Window.Resources>


C#:

this.dataGrid.QueryRowHeight += OnQueryRowHeight;

String displayText =
"";

private void OnQueryRowHeight(object sender, QueryRowHeightEventArgs e)

{

    if (dataGrid.IsTableSummaryIndex(e.RowIndex))

    {

        var summary = this.dataGrid.View.Records.TableSummaries[0];

        if (summary.SummaryRow.ShowSummaryInRow)

            displayText = SummaryCreator.GetSummaryDisplayTextForRow(summary, this.dataGrid.View);

        else

            displayText = SummaryCreator.GetSummaryDisplayText(summary, "UnitPrice", this.dataGrid.View);

        var column = this.dataGrid.Columns["UnitPrice"];

        TextBlock textBlock = new TextBlock();

        var parentBorder = new Border { Child = textBlock };

        textBlock.Text = displayText;

        textBlock.TextWrapping = TextWrapping.Wrap;

        textBlock.MaxWidth = column.ActualWidth;

        textBlock.MaxHeight = double.PositiveInfinity;

        textBlock.Padding = new Thickness(10);

        parentBorder.Measure(new System.Windows.Size(textBlock.MaxWidth, textBlock.MaxHeight));

        e.Height = parentBorder.DesiredSize.Height;

        e.Handled = true;

    }

}


Here we have prepared the sample, based on your scenario. Please have a look at this.

If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Attachment: SfDataGrid_Demo_da5290f6.zip

Loader.
Live Chat Icon For mobile
Up arrow icon