Thursday, 23 November 2017

How to display images dynamically in jasper report using iReport

This article is all about displaying dynamic images in jasper report using iReport. I will show you step by step how to show images dynamically in iReport. Here dynamic images mean your images are stored in database like (PostgreSQL, MySQL, SQL etc) and we want to show that image or picture in our jasper report using iReport Designer. 

Before going deep into this tutorial we need to know that images are stored in the Database in Blob or bytea etc format and before using these images we need to convert or encode these images into text or string format.

Bytea type image stored in PostgreSQL

       
select image_field from table_name where id = 1           
 


Encode Image Field


       
select encode(image_field,'escape') from table_name where id = 1          
 


The reason for encoding these images into text is that we are going to use these (text/string) field in jasper report Image. To do so we use encode function of PostgreSQL, which takes two parameter the first one is image field with bytea type and the second is escape. This function converts bytea type image field into encode text type field.


Now that we have encoded our image field to use in jasper report using iReport. Now its time to use this field in report. To use this field create a new report in iReport Designer.

1- And add Report Query to fetch data for your report. Here we will use above query that we have encoded in above steps.
2- After that drag and drop Image property from Palette area. If you don't view this palette area than go to Window menu and select Palette or press Ctrl+Shift+8.



3- Now select image that you have drag and drop in step no 2, and click on Image Expression from properties window.


4- Copy below code and paste in Image Expression window and change name of image field as per your field name and click on OK.

       
new java.io.ByteArrayInputStream(org.apache.commons.codec.binary.Base64.decodeBase64($F{your_image_field}.getBytes()))           
 

You have done!!! Save your changes and preview your report.

No comments:

Post a Comment