RDLC dynamically add images to report

Question

I have list of images in remote server, i need to show some of these images in a existing report. I tried by dropping an image control to the rdlc and it works for single image.

But i need to show more than one image, which has no fixed count.

I referred below posts, but none are clear:

C# - Add List of images to report viewer

Insert unknown number of Images to the report at runtime using reportviewer

http://www.c-sharpcorner.com/blogs/6194/display-image-in-rdlc-report-microsoft-report-viewer.aspx%27

I know there might be possible duplicates for this request, please guide me if so.

Answer 1

I started by adding a table to the existing reports, as in above mentioned post, removed the unnecessary columns, then added an image to the left out cell in the rdlc design. In the image property set the source to "External"

Now open the rdlc in xml view, there find the dataset tag, add a new dataset for the new table with images

<DataSet Name="DataSet1">
  <Fields>
    <Field Name="filepath">
      <DataField>track_file_id_pk</DataField>
      <rd:TypeName>System.string</rd:TypeName>
    </Field>
    </Field>
  </Fields>
  <Query>
    <DataSourceName>xxxt</DataSourceName>
    <CommandText>/* Local Query */</CommandText>
  </Query>
  <rd:DataSetInfo>
    <rd:DataSetName>xxx</rd:DataSetName>
    ...
  </rd:DataSetInfo>
</DataSet>

Now adding the images list dataset to the new table as shown below

<Tablix Name="Tablix2">
    ....
    </TablixRowHierarchy>
    <DataSetName>ImgDataSet</DataSetName>

Go back to design view of rdlc, go to image properties, set the "use this image" field

In code behind create Datatable with one column "filepath", add rows with images filepath then add datasource to report below the existing datasource.

DataTable dtable = new DataTable();
DataColumn dcol = new DataColumn("filepath");
dtable.Columns.Add(dcol);

DataRow drow = dtable.NewRow();
string pat = new Uri(Server.MapPath("~/Content/DSC_019.jpg")).AbsoluteUri;
drow["track_file_uuidName"] = pat;
dtable.Rows.Add(drow);
...

ReportViewer1.LocalReport.EnableExternalImages = true;

...
ReportViewer1.LocalReport.DataSources.Clear();
ReportViewer1.LocalReport.DataSources.Add(new ReportDataSource("rptDataSet", objCommonreport.ReportTable));
ReportViewer1.LocalReport.DataSources.Add(new ReportDataSource("DataSet1", dtable));

Answer 2

I did the following to show a list of images with unknown number of items in a matrix.

First create a dataset with only one field in it, you can whatever you want , i named it "filepath" and name of dataset to be "DataSet5". You can change the name and use it accordingly.

Then you need to add a table, delete unnecessary rows and columns such that you are left with only 1 column and row (1x1) matrix. Insert an image in that column, set its properties now. Image source should be EXTERNAL.

In your aspx.cs file for the report, get the paths of the images from the database, now get absolute paths for these and append "file:///" as reports require a file to be shown. I did like this:

string rel_Path = HttpContext.Current.Server.MapPath("~");
if (_articleOrders.Any())
        {
            foreach (ArticleOrder order in _articleOrders)
            {
                if (!string.IsNullOrEmpty(order.ArticleImage))
                {
                    if (File.Exists(rel_Path + "\\" + order.ArticleImage))
                    {
                        var AIpath = "file:///" + rel_Path + "\\" + order.ArticleImage;
                        articleImagesList.Add(AIpath);
                    }
                }
            }
            CreateDatasetForImages(articleImagesList);
        }

Then I added data to dataset like below:

private void CreateDatasetForImages(List<string> articleImagesList)
    {
        DataTable table = new DataTable();
        table.Columns.Add("filepath", typeof(string));

        foreach (string articleImage in articleImagesList)
        {
            DataRow drow = table.NewRow();
            string pat = articleImage;
            drow["filepath"] = pat;
            table.Rows.Add(drow);
        }
        FlowerBookingReportViewer.LocalReport.DataSources.Add(new ReportDataSource("DataSet5", table));
    }

Now again go to image properties and set "Use This Image" to [filepath] as it the name of the column in our dataset that is holding the path of the image. Hope it works for someone!