RadGridView and RadHostItem

[Stefano]

Hello,
I found some problems trying to use the RadHostItem control to customize the cells of a RadGridView.
I developed a class (MyCell) that derives from GridDataCellElement; in such class, the RadHostItem hosts a RadTextBox control.
In the CreateCell event of the RadGridView, I set the cell tyle as typeof(MyCell).
Everything works fine, the RadTextBox control appears in the Grid cells but, and this is the problem I'd need to solve, when I scroll down the Grid, the RadTextBox controls cover and hide the Column Headers of the Grid.

I'm using RadControls for WinForms Q1 2010 SP2.
As attachment "scroll.JPG" shows what happens.

Could you please help me ? Many thanks in advance
Stefano

The entire source code is:

public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();
    }

    private void Form1_Load(object sender, EventArgs e)
    {
        DataTable dtGrid = new DataTable();
        dtGrid.Columns.Add("COL1", typeof(string));
        dtGrid.Columns.Add("COL2", typeof(string));

        for (int j = 0; j < 20; j++)
        {
            dtGrid.Rows.Add("val_0", "val_1");
        }
        radGridView1.DataSource = dtGrid;

    }


    void radGridView1_CreateCell(object sender, GridViewCreateCellEventArgs e)
    {
        if (e.CellType == typeof(GridDataCellElement) && e.Row is GridDataRowElement)
        {
            e.CellType = typeof(MyCell);
        }
    }

}


public class MyCell : GridDataCellElement
{
    private RadHostItem _RadHostItem;
    private RadTextBox _RadTextBox;


    public MyCell(GridViewColumn column, GridRowElement row)
        : base(column, row)
    {
    }

    protected override void CreateChildElements()
    {
        base.CreateChildElements();

        _RadTextBox = new RadTextBox();
        _RadTextBox.Name = "_RadTextBox";
        _RadHostItem = new RadHostItem(_RadTextBox);

        Children.Add(_RadHostItem);

    }

    public override void SetContent()
    {
        _RadTextBox.Text = "flower";
    }

    protected override SizeF ArrangeOverride(SizeF finalSize)
    {

        SizeF size = base.ArrangeOverride(finalSize);

        float width = size.Width;
        float height = size.Height;

        _RadHostItem.Arrange(new RectangleF(1f, 1f, width - 1f, height - 1f));

        return size;
    }

}

​

[Dess | Tech Support Engineer, Principal]

Hello Stefano,

Thank you for writing.

In order to avoid such undesired behavior when scrolling, the custom GridDataCellElement should be composed only of RadElements. However, note that RadTextBoxElement hosts the MS TextBox control. I would recommend you to use a RadTextBoxControlElement. However, the suggested solution is applicable for the latest version. Here is the modified code snippet:

public Form1()
{
    InitializeComponent();

    DataTable dtGrid = new DataTable();
    dtGrid.Columns.Add("COL1", typeof(string));
    dtGrid.Columns.Add("COL2", typeof(string));

    for (int j = 0; j < 20; j++)
    {
        dtGrid.Rows.Add("val_0", "val_1");
    }
    radGridView1.DataSource = dtGrid;
}

private void radGridView1_CreateCell(object sender, Telerik.WinControls.UI.GridViewCreateCellEventArgs e)
{
    if (e.CellType == typeof(GridDataCellElement) && e.Row is GridDataRowElement)
    {
        e.CellType = typeof(MyCell);
    }
}

public class MyCell : GridDataCellElement
{
    private MyRadTextBoxControlElement _RadTextBox;

    public MyCell(GridViewColumn column, GridRowElement row) : base(column, row)
    {
    }

    protected override void CreateChildElements()
    {
        base.CreateChildElements();

        _RadTextBox = new MyRadTextBoxControlElement();

        Children.Add(_RadTextBox);
    }

    public override void SetContent()
    {
        _RadTextBox.Text = "flower";
    }
}

public class MyRadTextBoxControlElement : RadTextBoxControlElement
{
    protected override Type ThemeEffectiveType
    {
        get
        {
            return typeof(RadTextBoxControlElement);
        }
    }

    protected override void OnLoaded()
    {
        this.InvalidateMeasure();
    }
}

I hope this information helps. Should you have further questions, I would be glad to help.

Regards,
Desislava
Telerik

 

 

[Stefano]

Hi Desislava,
many thanks for answering me.

Unfortunately, what i did post was just a prototype, to simplify my question.
In my real application, i must show, inside the grid cell, somethig more complex: it is the union of Labels, Images, Buttons and even a Windows.Forms.ListView control. To have the ListView control, it was necessary to use the RadHostItem control to host it. But this causes the scroll problem. You can see a screenshot of my real Grid in the new attached file. 
So, have I to give up to get the Windows.Forms.ListView insiede the cell ? Is there any solution ?

Thanks
Regards
Stefano

[Dess | Tech Support Engineer, Principal]

Hello Stefano,

Thank you for writing back.

Note that using controls in grid cells may slow down the scrolling and will cause visual glitches (similar to the one demonstrated in your screenshot). It is recommended to use only elements. You can follow similar approach for RadListView as demonstrated in my previous post. Instead of using a RadHostItem with RadListView, you can insert a RadListViewElement to the GridDataCellElement.Children collection:

public class MyCell : GridDataCellElement
{
    private RadListViewElement ListViewElement;

    public MyCell(GridViewColumn column, GridRowElement row) : base(column, row)
    {
    }

    protected override void CreateChildElements()
    {
        base.CreateChildElements();

        ListViewElement = new RadListViewElement();
        ListViewElement.SelectedIndexChanged+=ListViewElement_SelectedIndexChanged;
        ListViewElement.ItemSize = new System.Drawing.Size(20, 20);
        ListViewElement.DataSource = new List<string>() { "one", "two", "three"};
        Children.Add(ListViewElement);
    }

    private void ListViewElement_SelectedIndexChanged(object sender, EventArgs e)
    {
       //ToDo
    }

}

I hope this information helps. If you have any additional questions, please let me know.
 
Regards,
Desislava
Telerik

 

 

[Stefano]

Hi Desislava,
thanks once again.

I must say that I'm using RadControls for WinForms Q1 2010 SP2, and there is no Datasource property for RadListViewElement. Besides, inside the cell, I'd need a multi-columns grid, with headers for each column.
I also did try to use RadListViewElement, but I found no way to obtain an appearance similar to a grid (columns, column headers, row separator lines and son on).

Best regards
Stefano

[Dess | Tech Support Engineer, Principal]

Hello Stefano,

Thank you for writing back.

In Q2 2011 (version 2011.2.11.712) we introduced a new RadListView which supports predefined configurable views and layouts (ListView, IconView, DetailView). I would recommend you to upgrade in order to achieve your goal and to benefit from all the introduced features and new controls. Please refer to the attached screenshot. 

I hope this information helps. If you have any additional questions, please let me know.

Regards,
Desislava
Telerik

 

 

[Stefano]

Thanks Desislava,
best regards
Stefano