Creating pictureBox programmatically.

[ANDREI]

Hello.

I have an "ImageModel" class List in a data source item. Every "ImageModel" instance contains byte array "Image" field. I need to create and add pictureBox to the panel for every  "Image" field. I try to do it in the panel's ItemDataBinding event handler:

 private void pnlImg_ItemDataBinding(object sender, EventArgs e)
        {
            var panel =  sender as Telerik.Reporting.Processing.Panel;
         
            var imageList = panel.DataObject["ImageList"] as ICollection<ImageModel>;
         
            var pictureBox = new Telerik.Reporting.PictureBox();

            for (int i = 1; i <= imageList.Count; i+=1)
            {
                pictureBox.MimeType = "image/jpeg";
                pictureBox.Size = new Telerik.Reporting.Drawing.SizeU(Telerik.Reporting.Drawing.Unit.Cm(1.8D), Telerik.Reporting.Drawing.Unit.Cm(1.3D));
                pictureBox.Sizing = Telerik.Reporting.Drawing.ImageSizeMode.ScaleProportional;
                pictureBox.Visible = true;
                pictureBox.Location = new Telerik.Reporting.Drawing.PointU(Telerik.Reporting.Drawing.Unit.Cm(i%4==0 ? 0 : 1.8D*i), Telerik.Reporting.Drawing.Unit.Cm(1.3D*(i/4)));
                using (var ms = new MemoryStream(imageList.ElementAt(i-1).Image))
                {
                    pictureBox.Value = Image.FromStream(ms);
                }
                pnlImg.Items.Add( pictureBox );
            }
        }

In the result I get the empty panel. I tried to use Telerik.Reporting.Processing.PictureBox() instead Telerik.Reporting.PictureBox(), but there is no ability to create an instance of a Telerik.Reporting.Processing.PictureBox. Is there any ability to create pictureBox programmatically and add it to a Telerik.Reporting.Panel? I'm using Telerik Reporting Q1 2014 Trial Version.

Thanks!

[Peter]

Hi Andrei,

Instead of adding PictureBoxes programmatically our recommendation is to use nested data items (List) and bind the nested data item with Binding:

Property path	Expression
DataSource	=Fields.ImageList

Then you can add PictureBox to the List Panel and according to the ImageList structure set the PictureBox.Value to the following expression:
=Fields.Item
or
=Fields.Image

Regards,
Peter
Telerik

 

 

[ANDREI]

Hi Peter,

In this case I have another problem, I cannot arrange images. I need to display for example 5 images in one line  and go to another line in order not to display all images in one horizontal or vertical column. But I could not find a way to do it. All images a displayed in one column. I thought that using panel's ItemDataBinding event handler I can specify location of every image. Can you tell me, how to  display several images in one line and go to another line?

Thanks!

[Nasko]

Hello Andrei,

If you need to display the images in multiple columns/rows you can use the Crosstab item instead of the List item. It can display aggregated data summaries, grouped in rows and columns. The number of rows and columns for groups is determined by the number of unique values for each row and column groups.
For more information, please refer to the Grouping Data and Understanding CrossTab areas help articles.

Regards,
Nasko
Telerik

 

 

[Madhu]

Dear Sir,


Can You send me some code for adding picturebox programatically.

thanks
vilas

[Nasko]

Hello Vilas,

You can generate the sample code using the Visual Studio Report Designer.
Create a new report and add a PictureBox item in the Visual Studio Report Designer and use the automatically generated code in the .Designer.cs file as a template for dynamic PictureBox generation. You may also find useful the Reporting API Reference.

Regards,
Nasko
Telerik

 

 

[Chris]

Hello, 

Is there any sample code for this? I am trying to do something similar but not entirely sure how to wire everything up. 

Thanks!

Chris

[Stef]

Hi Chris,

Based on your support history, you have a list of image objects that you need to display in a report.

We can suggest you to use a List item, then place a PictureBox item in it. Set the List.DataSource to the list of image objects  via ObjectDataSource, and the PictureBox.Value to an expression like Fields.Item (the Expression Editor will let you see he correct name of the image field).


If you need further help, please elaborate on the data you will use, how it is retrieved and how it should be visualized in a report.

Regards,
Stef
Telerik by Progress

[Chris]

Hi Stef, 

Your approach is close to the one I used however I used an expression to set the list control datasource and picturebox value. I had a simple List<Image> that I needed to bind to and this post: 

http://www.telerik.com/forums/binding-collection-of-simple-types-e-g-list-lt-string-gt

by Monsignor was the missing piece for me.  Hopefully this can help someone else as well. 

Chris