This article shows how to create a widget in an ADF Faces application that looks like this:

This table shows a comparison between records – Departments in this case – on a number of different aspects. The table compares four departments on characteristics like their name and location, the number of staff they contain and the Average Salary (in $) and Experience (in Days). Some of these comparisons are visualized by bars – with the length of the bar depicting the value at stake.

The comparison table could be further improved by introducing colors, nicer looking labels, highlighting exceptions, indicating thresholds, using Gauges etc. That’s for another time.

In this article, the topics covered are:

  • create ViewObject to gather the data
  • create a Managed Bean that constructs the data model – based on the data provided through the ViewObject – in a structure that the web page can work with
  • create a dynamic table component that paints the table using the Managed Bean’s model (using the approach introduced in a previous article – More >