How do I customize the GridGroupExpanderCell?

4 posts, 0 answers
  1. OverCoded
    OverCoded avatar
    34 posts
    Member since:
    Mar 2010

    Posted 17 May 2010 Link to this post

    I am using VS2010 Premium and the most recent version of Telerik WinForms. I have a custom RadGrid wit hierarchical data and I want to change the default ugly expander cell from the large unformatted plus and minus. I have tried to change it with the VSB but the only attribute I seem to be able to modify is the line color and the scaling. I know this can be modified because I have seen other grids with different expander cell styles. Can anyone shed some light on this seeing that Telerik has decided to keep it a secret?

  2. Jack
    Admin
    Jack avatar
    2335 posts

    Posted 18 May 2010 Link to this post

    Hi Mark Coe,

    Please follow these steps:

    1. Select GroupExpanderCell from the Elements pane
    2. Expand the row
    3. Select and right click in the property grid
    4. Select the No filter option
    5. Locate the SignStyle property

    There are a lot of properties that can be customized. If you want you can use images. In this case change the SignStyle to Image and set the SignImage property.

    You can do this with code by handling the ViewCellFormatting event. Here is a sample:

    void radGridView1_ViewCellFormatting(object sender, CellFormattingEventArgs e)
    {
        GridGroupExpanderCellElement cell = e.CellElement as GridGroupExpanderCellElement;
        if (cell != null)
        {
            cell.SignStyle = GridExpanderPrimitive.SignStyles.Triangle;
        }
    }

    Should you have any other questions, please feel free to contact me.

    Kind regards,
    Jack
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. UI for WinForms is Visual Studio 2017 Ready
  4. Carlos
    Carlos avatar
    8 posts
    Member since:
    Dec 2012

    Posted 07 Mar 2015 in reply to Jack Link to this post

    I would like to use my own images and programmatically change the image when expanded or contracted.
    I was looking at the group.expanded property of the radgrid to change the image but I don't know how to reference the element from there.
    Thanks
  5. Stefan
    Admin
    Stefan avatar
    2891 posts

    Posted 10 Mar 2015 Link to this post

    Hello Carlos,

    One way to change the desired images is to edit the theme(s) that you use and set the images to the appropriate states for the ExpanderItem (see attached image). You can use Visual Style Builder to edit your themes.

    Alternatively, you cause the ViewCellFormatting event to do that:
    void radGridView1_ViewCellFormatting(object sender, Telerik.WinControls.UI.CellFormattingEventArgs e)
    {
        GridGroupExpanderCellElement expanderCell = e.CellElement as GridGroupExpanderCellElement;
        if (expanderCell != null)
        {
            if (e.Row.IsExpanded)
            {
                expanderCell.Expander.SignImage = Resources.expanded;
            }
            else
            {
                expanderCell.Expander.SignImage = Resources.collapsed;
            }
        }
    }

    In addition you might need to invalidate the row when an expand action occurs. The GroupExpanded event is suitable for this:
    void radGridView1_GroupExpanded(object sender, GroupExpandedEventArgs e)
    {
        e.DataGroup.GroupRow.InvalidateRow();
    }

    I hope that you find this information useful. Should you have any other questions, do not hesitate to contact us.

    Regards,
    Stefan
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top