Because I am constantly busy working on something, I have never had time to actually put everything in words and pictures. But, since you got here, then you must have already seen some part of my work - and this is the way I’m talking.I'm 23, born in Romania, student at UPG Romania in software development field. I started from 0, mostly with basic stuff, and I’m evolving every day to an expert. I'm focused on freelancing projects, from small websites, to really heavy stuff. I know that I look and act differently from most developers, but this is why you will love to work with me! Constantin has posted 42 posts at DZone. You can read more from them at their website. View Full User Profile

Dynamic images with PrimeFaces

  • submit to reddit

PrimeFaces is a lightweight library for JSF with regard to its functionality, simplicity, and support. Its power consists in AJAX support, providing more than 70 AJAX-based components. The additional TouchFaces module features a UI kit for developing mobile web applications. In this recipe, you will see how to use PrimeFaces to retrieve images from a database and to provide them dynamically to our JSF page.

Getting ready
We have developed this recipe with NetBeans 6.8, JSF 2.0, and GlassFish v3. The JSF 2.0 classes were obtained from the NetBeans JSF 2.0 bundled library. In addition, we have used PrimeFaces 2.0, which provide support for JSF 2.0. You can download this distribution from

How to do it...
Our recipe will look very simple, thanks to PrimeFaces. Practically, all we do is to pick up the PrimeFaces fruits. The following code retrieves a BLOB from a JDBC ResultSet and provides its InputStream as a StreamedContent (the backing bean is listed next):

public class PictureBean {

private StreamedContent myImage;

public PictureBean() {
InputStream inputStream = //InputStream of a blob
myImage = new DefaultStreamedContent(inputStream, "image/png");

public StreamedContent getMyImage() {
return myImage;

public void setMyImage(StreamedContent myImage) {
this.myImage = myImage;

And the p:graphicImage tag can display any binary image, as shown next:

<p:graphicImage value="#{pictureBean.myImage}" />

How it works...
The entire solution is mapped in PrimeFaces; therefore you will need to go deeply into this framework to understand its secrets. Apparently, everything we have done relates to a simple JSF application with a simple conversational state between a JSF page and a backing bean.



Published at DZone with permission of its author, Constantin Alin.

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)