Friday, February 1, 2013

Oracle ADF Read Images From Database Dynamically

Following is one of the way of displaying images from database dynamically and show on ADF page without using HTTP Servlet. The advantage of this method is that we don't require to create DB connection, create and execute query, which are required if we use servlet for displaying the images.

Following are the steps:

1) Create View Object : First create a view object based on table having images as blob column. The below viewObject is based on entityObject but should be created as read only without entity object.


2) Create Managed/Backing Bean: Create a bean file and write following code to read the blob content of image as byte array and convert that to encoded string. This string content will be used to display the image on page.

    public String getImageArray() {
            BlobDomain attribute = (BlobDomain)ADFUtils.evaluateEL("#{row.bindings.Image.inputValue}");
            try {
                byte[]   bytesEncoded = Base64.encode(attribute .getBytes(1L,(int)attribute.getLength()));
                imageArray= new String(bytesEncoded);
            } catch (Exception e) {
                e.printStackTrace();
            }
        return imageArray;
    }


The above code is using EL as #{row.bindings.Image.inputValue} since the data is shown under table.

3) Create Image Component: Drop the image attribute from datacontrol onto jspx page as outputText component just to create the binding of the image attribute. Alternatively we can go to binding tab of the page and add image attribute binding. Now add image component as follow:

           <af:image  source="data:image/png;base64,#{bean.imageArray}"
                          shortDesc="#{row.bindings.ImageName.inputValue}"
                          id="it1">
            </af:image>

4) Final Page: The above method will display the images as follow