Add image to a column and make column text a link

2 posts, 0 answers
  1. Hassan
    Hassan avatar
    10 posts
    Member since:
    Oct 2010

    Posted 14 Oct 2011 Link to this post


    I am using RadListView in DetailView type and have 4 columns.  I would like to display an image before the text in the 3rd column depending on the data in that column.  The column holds a file name i.e myFile.pdf and I would like to make that a link that is clickable how do I do that?

    I know this is twp questions into one but I really need a quick response and the Issue tracker site is not working at the moment

  2. Ivan Todorov
    Ivan Todorov avatar
    688 posts

    Posted 17 Oct 2011 Link to this post

    Hi Hassan,

    Thank you for your question.

    You can achieve this by creating a custom cell element and use the CellCreating event to incorporate it in RadListView. The following code demonstrates this:
    public partial class Form1 : Form
        public Form1()
            this.radListView1.CellCreating += new Telerik.WinControls.UI.ListViewCellElementCreatingEventHandler(radListView1_CellCreating);
        void radListView1_CellCreating(object sender, Telerik.WinControls.UI.ListViewCellElementCreatingEventArgs e)
            if (e.CellElement.Data == this.radListView1.Columns[2] &&
                !(e.CellElement is DetailListViewHeaderCellElement))
                DetailListViewVisualItem item = (DetailListViewVisualItem)
                    typeof(DetailListViewDataCellElement).GetField("row", BindingFlags.NonPublic | BindingFlags.Instance).GetValue(e.CellElement);
                e.CellElement =
                    new LinkCellElement(item, e.CellElement.Data);
    public class LinkCellElement : DetailListViewDataCellElement
        public LinkCellElement(DetailListViewVisualItem item, ListViewDetailColumn column)
            : base(item, column)
        {        }
        protected override void OnMouseDown(MouseEventArgs e)
            //do what you need on the clicked message
        public override void Synchronize()
            this.Image = GetImageForFileType(this.Text); // load your image depending on the extension
            this.Font = new Font(this.Font, FontStyle.Underline);
            this.ForeColor = Color.DarkBlue;
        protected override Type ThemeEffectiveType
                return typeof(DetailListViewDataCellElement);

    Here we need to use reflection to get the row associated with the default cell, but in the next official releases we will introduce properties which will let you access them directly.

    I hope this is useful. In case you have any additional questions, do not hesitate to write back.

    Best wishes,
    Ivan Todorov
    the Telerik team

    Q2’11 SP1 of RadControls for WinForms is available for download (see what's new); also available is the Q3'11 Roadmap for Telerik Windows Forms controls.

Back to Top