Merged cells on single row

[Randy Hompesch]

Hi,

I want to basically have a completely unbound grid with some merged cells in row 0.

So, if I had 3 rows with 3 cols, I would want (Where A1, B1 and C1 etc. represent data):

Row 1: A1, B1 Merged with C1
Row 2: A2, B2, C2
Row 3: A3, B3, C3

And a have a single row on the column headers.

Can someone kindly show me the code for this?

Thanks ... Ed

 

[Dimitar]

Hi Randy,

Thank you for writing.

The following article explains the possible ways for merging cells in RadGridView: Merge Cells.

I hope this will be useful.

Regards,
Dimitar
Telerik

[Randy Hompesch]

I don't think you understand the question.

Basically, I want to merge cells on a single row of the grid. I don't want headers merged. To give you an  example, I might have a grid with 5 rows and 3 columns.  I don't want anything merged except 2 cells  on row 3. Can I get there? If so, some sample code would be great! The htmlViewDefinition seems like it affects all rows in the grid (including headers), is this correct?  If not, please lead the way!

See the attached screen shot for an example of what I am trying to do.

Thanks ... Ed

 

[Dimitar]

Hi Randy,

Thank you for writing back.

In your case, you should use the third approach shown in the article. This will allow you to visually merge the cells. 

Let me know if you have additional questions.

Regards,
Dimitar
Telerik

[Randy Hompesch]

Hi,

in looking at what you suggest, it appears that all it is doing is hiding/showing borders and text. Using this method would I be able to center text  across the merged cells?

Thanks ... Ed

[Dimitar]

Hi Randy,

Thank you for writing back.

No, with this method you won't be able to center the text. If you need this for a particular row only, perhaps you can create a custom row element and show the cell, However, this approach would have some limitations as well (for example you will not able to edit the cell).

Here is how you can create the custom row element:

class MyGridRowElement : GridDataRowElement
{
    LightVisualElement mycell = new LightVisualElement();
    protected override void CreateChildElements()
    {
        base.CreateChildElements();

        mycell.DrawText = true;
        mycell.Text = "test";
        mycell.DrawFill = true;
        mycell.BackColor = Color.White;
        mycell.GradientStyle = Telerik.WinControls.GradientStyles.Solid;

        mycell.DrawBorder = true;
        mycell.BorderBoxStyle = Telerik.WinControls.BorderBoxStyle.FourBorders;
        mycell.BorderLeftColor = Color.FromArgb(209, 225, 245);
        mycell.BorderTopColor = Color.FromArgb(209, 225, 245);
        mycell.BorderBottomColor = Color.FromArgb(209, 225, 245);
        mycell.BorderRightWidth = 0;

        this.Children.Add(mycell);

    }
    public override GridCellElement CreateCell(GridViewColumn column)
    {
        var cell =  base.CreateCell(column);
        if (column.Index >=2)
        {
            cell.Visibility = Telerik.WinControls.ElementVisibility.Hidden;
        }
        return cell;
    }

    public override bool IsCompatible(GridViewRowInfo data, object context)
    {
        return false;
    }
    protected override Type ThemeEffectiveType
    {
        get
        {
            return typeof(GridDataRowElement);
        }
    }
    protected override SizeF ArrangeOverride(SizeF finalSize)
    {
        var result = base.ArrangeOverride(finalSize);
        var X = this.VisualCells[3].ControlBoundingRectangle.X;
        var width = this.VisualCells[3].ControlBoundingRectangle.Width + this.VisualCells[4].ControlBoundingRectangle.Width;
        mycell.Arrange(new RectangleF(X, 0, width-2, finalSize.Height));

        return result;

    }
}

You can use the CreateRow event to change the default row:

private void RadGridView1_CreateRow(object sender, GridViewCreateRowEventArgs e)
{
    if (e.RowInfo is GridViewDataRowInfo && e.RowInfo.Index == 2)
    {
        e.RowElement = new MyGridRowElement();
    }
}

The attached image shows the result on my side.

I hope this helps.

Regards,
Dimitar
Telerik

[Randy Hompesch]

Thanks. However, this seems like an incredible hack. I am disappointed that there is not a simple way to span cells with text. This is  a common requirement. Perhaps Telerik should look into adding this functionality?

In the meantime, I won't be able to use RadGridView ... at least in this instance.

Ed

 

[Dimitar]

Hello Ed,

Thank you for writing back.

I am sorry to hear that you are disappointed and cannot use the grid for your scenario. Semantically, RadGridView's default view (TableViewDefinition) is record based, where cell and rows do not apply, and the only view where we support this is the HtmlViewDefinition, which seems will not work for you as well. 

 We will strongly consider your feedback and think for a better ways for implementing this functionality. Unfortunately, at this point, there are no other ways for cells merging than the ones I have already shown.  
 In fact, merging just some records, would be more applicable to a spreadsheet control (like excel), rather than a grid control. If this is what you need, we do have a feature request for such and if you find it useful, feel free to vote for it using the Like button on this page: http://feedback.telerik.com/Project/154/Feedback/Details/136479
 
 If a spreadsheet is what you are looking for, what I can offer for the time being is to look at the offering our WPF suite has for such control: http://docs.telerik.com/devtools/wpf/controls/radspreadsheet/overview. If this is what you are looking for, you can host this component in your WinForms application via element host and take advantage of its capabilities. More information on hosting WPF control in WinForms apps can be found here: http://www.telerik.com/support/code-library/integration-with-wpf
 
I hope that you find this information useful. Should you have any other questions, do not hesitate to contact us. 

 

Regards,
Dimitar
Telerik

[Joe]

Not to hawk someone elses product but when I had this same need a few years back I used flexgrid (component one) - it allowed cells with similar data types to merge.  I like radgrid better overall, but for that project it solved my problem.

 

Joe

[Dimitar]

Hi Joe,

Thank you for sharing your feedback.

We are aware that our users can benefit from this feature and we well see how it can be included in our grid.

If you have any additional feedback about this feature do not hesitate to share it in this thread.   

Regards,
Dimitar
Telerik

[maal]

Is this possible for the WPF Control? In WPF there is no CreateRow Event.

[Dimitar]

Hi Maal,

In WPF this is supported out of the box and there is no need to create custom rows: Merged Cells - Telerik UI for WPF. 

I want to kindly ask to post any further questions about the WPF grid in the following forum: Forum threads about GridView UI for WPF.

I hope this will be useful. Let me know if you have additional questions.

Regards,
Dimitar
Progress Telerik