ActiveReports: Showing Images From Paths Saved in Database

DESCRIPTION

Images play an important role when it comes to designing a report. It not only enhances the appearance of the report but sometimes also displays important data in pictorial form. Typically the images in a Section Based Reports are displayed using the Picture control and the images are passed directly using absolute/relative paths. Alternatively, images can be saved in a database column and the field name can be set as the DataField property for the Picture control. This automatically displays the image in the Picture control as and when the image is fetched from the database. However what if we save the path to the images in a database column which can be either a Local path or an HTTP path? With the flexibility which ActiveReports offers the obvious answer is Yes. Let us find out how but before that here is a sneak peak of the output which we will get:

IMPLEMENTATION

• Problem

As we noticed, the image path may be a local path or an HTTP path. The local images can be directly displayed in the Picture control; however for images with HTTP path, we will need to use the RichTextBox control. But unlike the images saved in a database column, we are not setting the DataField property which will automatically fetch the next image from the database. So we need to find some way which gets the path to the next image.

• Solution

We can place textbox controls on the report with their visibility set to false. These textboxes will actually be bound to the fields which store the image paths in the database. This will return the image paths which can be further used to display the images in the Picture and the RichTextBox control. The tricky part for HTTP images is that we will need to append an image tag to the paths so that the RichTextBox control can interpret it as a valid html. Here is the code which we need.

private void SectionReport1\_ReportStart\_1(object sender, EventArgs e)  
{  
   OleDBDataSource _oleConn = new OleDBDataSource();  
   _oleConn.ConnectionString = @"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=..\\..\\ImagePath.mdb;Persist Security Info=False";  
   _oleConn.SQL = "Select * from ImageTable";  
   this.DataSource = _oleConn;  
}  

private void Detail_Format(object sender, EventArgs e)  
{  
   //Local Images  
   string localPath = txtLocalPath1.Text.Replace("#", "");  
   Picture1.Image = System.Drawing.Image.FromFile(localPath);  
   //HTTP Images  
   string linkURL = txtHttpPath1.Text.Replace("#", "");  
   RichTextBox1.Html = "<img src='" + linkURL + "'></img>";  
}

So we are all set now. Set up your database and use this approach to display images stored locally or over the web. A sample application demonstrating this implementation can be downloaded using the link provided below. Download Sample