Custom Cell displaying Multi-column list

[Taibe]

I need to show a multi-column list within a gridview cell (read-only). I've read the documentation on creating custom cells but can't figure out which element to use in my custom cell. If anyone has any sample code or could simply advise which RadElement to use, I would really appreciate it.

[Richard Slade]

Hello Taibe, 

You could use a RadListElement for this. 
If you need further help, please let me know
Richard

[Taibe]

Thank you, Richard. Actually, I do need some help because I need to display multiple columns of data (like a table within a table) and my understanding is that the ListElement displays one column. Ideally, I'd like to display three columns and the user should be able to hold his mouse over the value in each column and get an explanatory tooltip.

[Richard Slade]

Hello, 

I've prepared you a brief sample that uses a RadGridViewElement inside the cell. I hope this helps. If this is what you needed, please remember to mark as answer. If you need further help, please let me know

Thanks
Richard

Form 1 Designer

namespace RadControlsWinFormsApp1
{
    partial class RadForm1
    {
        /// <summary>
        /// Required designer variable.
        /// </summary>
        private System.ComponentModel.IContainer components = null;

        /// <summary>
        /// Clean up any resources being used.
        /// </summary>
        /// <param name="disposing">true if managed resources should be disposed; otherwise, false.</param>
        protected override void Dispose(bool disposing)
        {
            if (disposing && (components != null))
            {
                components.Dispose();
            }
            base.Dispose(disposing);
        }

        #region Windows Form Designer generated code

        /// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {
            this.radGridView1 = new Telerik.WinControls.UI.RadGridView();
            ((System.ComponentModel.ISupportInitialize)(this.radGridView1)).BeginInit();
            ((System.ComponentModel.ISupportInitialize)(this)).BeginInit();
            this.SuspendLayout();
            //
            // radGridView1
            //
            this.radGridView1.Dock = System.Windows.Forms.DockStyle.Fill;
            this.radGridView1.Location = new System.Drawing.Point(0, 0);
            this.radGridView1.Name = "radGridView1";
            this.radGridView1.Size = new System.Drawing.Size(641, 511);
            this.radGridView1.TabIndex = 0;
            this.radGridView1.Text = "radGridView1";
            //
            // RadForm1
            //
            this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(641, 511);
            this.Controls.Add(this.radGridView1);
            this.Name = "RadForm1";
            //
            //
            //
            this.RootElement.ApplyShapeToControl = true;
            this.Text = "RadForm1";
            this.ThemeName = "ControlDefault";
            ((System.ComponentModel.ISupportInitialize)(this.radGridView1)).EndInit();
            ((System.ComponentModel.ISupportInitialize)(this)).EndInit();
            this.ResumeLayout(false);

        }

        #endregion

        private Telerik.WinControls.UI.RadGridView radGridView1;




    }
}

Form 1 

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;
using Telerik.WinControls;
using Telerik.WinControls.UI;
using System.Linq;

namespace RadControlsWinFormsApp1
{
    public partial class RadForm1 : Telerik.WinControls.UI.RadForm
    {
        public RadForm1()
        {
            InitializeComponent();

            List<User> users = new List<User>();
            int k = 0;
            while (k <= 6)
            {
                List<CD> cds = new List<CD>();
                int j = k + 10;
                cds.Add(new CD(j, "CDa " + j.ToString(), "Artista " + j.ToString()));
                cds.Add(new CD(j, "CDb " + j.ToString(), "Artistb " + j.ToString()));
                cds.Add(new CD(j, "CDc " + j.ToString(), "Artistc " + j.ToString()));

                users.Add(new User(k, "User " + k.ToString(), cds));
                k++;
            }
            this.radGridView1.AutoGenerateColumns = false;
            this.radGridView1.DataSource = users;
            this.radGridView1.ReadOnly = false;

            GridViewDecimalColumn idColumn = new GridViewDecimalColumn("Id");
            GridViewTextBoxColumn nameColumn = new GridViewTextBoxColumn("Name");
            GridColumn cdsColumn = new GridColumn("CDs");
            this.radGridView1.Columns.Add(idColumn);
            this.radGridView1.Columns.Add(nameColumn);
            this.radGridView1.Columns.Add(cdsColumn);

            this.radGridView1.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill;
            this.radGridView1.BestFitColumns();


            foreach (GridViewRowInfo row in this.radGridView1.ChildRows)
            {
                row.Height = 70;
            }
            this.radGridView1.AllowRowResize = false;
        }

    }

    public class CD
    {
        public CD(int id, string tile, string artist)
        {
            Id = id;
            Title = tile;
            Artist = artist;
        }

        public CD()
        { }

        public int Id
        {
            get;
            set;
        }

        public string Title
        {
            get;
            set;
        }

        public string Artist
        {
            get;
            set;
        }
    }

    public class User
    {
        public User(int id, string name, List<CD> cds)
        {
            Id = id;
            Name = name;
            Cds = cds;
        }

        public User()
        { }

        public int Id
        {
            get;
            set;
        }

        public string Name
        {
            get;
            set;
        }

        public List<CD> Cds
        {
            get;
            set;
        }

    }

}

GridColumn.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Telerik.WinControls;
using Telerik.WinControls.UI;

namespace RadControlsWinFormsApp1
{
    public class GridColumn : GridViewDataColumn
    {
        public GridColumn(string fieldName)
            : base(fieldName)
        {
        }

        public override Type GetCellType(GridViewRowInfo row)
        {
            if (row is GridViewDataRowInfo)
            {
                return typeof(GridCellElement);
            }
            return base.GetCellType(row);
        }
    }
}

GridCellElement.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Telerik.WinControls;
using Telerik.WinControls.UI;
using Telerik.WinControls.RichTextBox;
using Telerik.WinControls.RichTextBox.Model.Styles;

namespace RadControlsWinFormsApp1
{
    public class GridCellElement : GridDataCellElement
    {

        public GridCellElement(GridColumn column, GridRowElement row)
            : base(column, row)
        {
        }

        private RadGridView _gridView;

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

            _gridView = new RadGridView();
            _gridView.Dock = System.Windows.Forms.DockStyle.Fill;
            _gridView.ReadOnly = true;
            _gridView.ShowFilteringRow = false;
            _gridView.ShowGroupPanel = false;
            _gridView.ShowColumnHeaders = false;
            _gridView.ShowRowHeaderColumn = false;
            _gridView.ShowNoDataText = false;
            _gridView.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill;
            _gridView.SelectionMode = GridViewSelectionMode.CellSelect;
            this.Children.Add(_gridView.GridViewElement);
        }

        protected override void SetContentCore(object value)
        {
            if (this.Value != null && this.Value != DBNull.Value)
            {
                this._gridView.DataSource = value;
                this._gridView.CellFormatting += new CellFormattingEventHandler(_gridView_CellFormatting);
            }
        }


        void _gridView_CellFormatting(object sender, CellFormattingEventArgs e)
        {
            e.CellElement.DrawFill = false;
            if (e.CellElement.IsSelected)
            {
                e.CellElement.DrawBorder = false;
            }
            else
            {
                e.CellElement.DrawBorder = true;
            }
            e.CellElement.ToolTipText = e.CellElement.Value.ToString();
        }


        protected override Type ThemeEffectiveType
        {
            get
            {
                return typeof(GridDataCellElement);
            }
        }

        public override bool IsCompatible(GridViewColumn data, object context)
        {
            return data is GridColumn && context is GridDataRowElement;
        }


    }


}

[Taibe]

Thank you, Richard! This is exactly what I need. I didn't realize one can create a GridViewCell with a GridView in it. I am really impressed that you took the time to write a full sample of the code that I need. Thank you!

[Richard Slade]

Glad I could be of help.
R