This is a migrated thread and some comments may be shown as answers.

Format/position texts on Group Row using HTML rendering

5 Answers 190 Views

GridView

This is a migrated thread and some comments may be shown as answers.

5 Answers, 1 is accepted

answered on 12 Oct 2020, 04:30 AM

Hi, Claire,

You can customize the group rows by handling the ViewCellFormatting event. An alternative approach is to use the GroupSummaryEvaluate event which allows modifying the header text of the group rows: https://docs.telerik.com/devtools/winforms/controls/gridview/grouping/formatting-group-header-row

As to the HTML-like text formatting, all supported tags are listed in the following help article: https://docs.telerik.com/devtools/winforms/telerik-presentation-framework/html-like-text-formatting

I hope this information helps. If you need any further assistance please don't hesitate to contact me.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

answered on 12 Oct 2020, 04:08 PM

Thanks for your kind reply.

yes. I am able to modify the group header text by GroupSummaryEvaluate event. However, when I apply html-like text formatting to locate the text position on the header, the text is showing in the left alignment. It seems that the CSS style for position setting does apply. Here is my code:

private void RadGridViewScriptQueue_GroupSummaryEvaluate(object sender, GroupSummaryEvaluationEventArgs e)
{
if (e.SummaryItem.Name == "Country")
{
e.FormatString = String.Format("<html><span style =\"position:relative;left:300px;\">{0}</span></html>", e.Value);
}
}

answered on 13 Oct 2020, 05:52 AM

Hello, Claire,

The HTML-like text formatting mechanism uses a few plain HTML tags to display formatted text such as font style, font color, font size, etc. The previously referred help article lists the supported tags: https://docs.telerik.com/devtools/winforms/telerik-presentation-framework/html-like-text-formatting

The relative position is not supported by the HTML-like functionality in the Telerik UI for WinForms suite.

If you want to shift the group text, you can handle the ViewCellFormatting event and either set the CellElement.TextAlignment property to the desired value or set the CellElement.Padding specifying the fixed left padding:

        private void radGridView1_ViewCellFormatting(object sender, CellFormattingEventArgs e)
        {
            if (e.Row is GridViewGroupRowInfo)
            {
                e.CellElement.DisableHTMLRendering = true; 
                e.CellElement.Padding = new Padding(200, 0, 0, 0);
            }
            else
            {
                e.CellElement.DisableHTMLRendering = false;
                e.CellElement.ResetValue(LightVisualElement.PaddingProperty, ValueResetFlags.Local);
            }
        }

Should you have further questions please let me know.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

answered on 13 Oct 2020, 09:51 PM

Thank you so much your more information. They are very help to align a text in group header. However, in my my case, I actually need to show more separate texts in specified positions on the group header. It is like to display the header with the following format:

Country (position 100px) CityName (position 200px) PostalCode (position 400px) telnumber (position 500)

In the ViewCellFormatting event, it seems there is only one CellElement to be able to set the position of the beginning text. Is there a way to set the positions of the rest of the texts?

answered on 14 Oct 2020, 12:01 PM

Hi, Claire,

It seems that you need to have several text elements inside the group row and thus adjust their location according to the columns for example. For this purpose you need a custom GridGroupContentCellElement and add as many text elements as you need. A sample approach is demonstrated in the last section "Custom group cell example" of the following help article: https://docs.telerik.com/devtools/winforms/controls/gridview/cells/creating-custom-cells

Another solution is demonstrated in the following knowledge base article. Even though it is purposed to display the top summary cells values while the group is being collapsed, you can adopt this solution to your scenario and show whatever information you need: https://www.telerik.com/support/kb/winforms/gridview/details/gridview-with-visible-summary-cells-in-a-collapsed-group

Feel free to use this approach which suits your requirements best.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).