[Solved] Dynamic Image GridView column

[Stephen]

Hi

I need to create GridView columns dynamically.  I can do text columns but do not know how to create a dynamic image column.
Can you supply example code for me please?  The image is a URL rather than the image bits.  I was using the standard DataGrid control and building the xaml at runtime and then loading the xaml into the columns contents, maybe I will have to do the same with the Telerik grid.

Regards
Steve

[Hristo Deshev]

Hi Stephen,

The options of defining a cell style with a cell template will work: you can either define the styles in a resource and associate them with the newly-added column, or use the XamlReader class to parse them yourself.

There is an easier approach though -- you can create your own column and override the cell element creation logic. You can just create an Image control there and return it -- it will be used inside the cell. Here's the code:

public class ImageColumn : GridViewDataColumn
{
    public override FrameworkElement CreateCellElement(Telerik.Windows.Controls.GridView.GridViewCell cell, object dataItem)
    {
        var cellImage = new Image() { Width = 272, Height = 125 };
        var imageUri = ((Message) dataItem).Image;
        cellImage.Source = new BitmapImage(new Uri(imageUri, UriKind.Relative));
        return cellImage;
    }
}

I am attaching a sample project for your reference.

Regards,
Hristo Deshev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[xiaofeng]

Sorry,I down load your solution,but it has some problem.I double click the image ,it will crash .I do a project as yours.But the picture will disappear when double clicking the window.

[Krlos]

Double click is for enabling edit mode, do you need here?, if no try this
var imageColumn = new ImageColumn() { Width = new GridLength(280), IsReadOnly = true } ;

Hope it helps.