Use DVT in an ADF Table

The use case here is based on the priority from a task. The requirement was not to show the priority as number, but with a color. It was surprisingly easy to accomplish this in ADF with DVT.

To illustrate I use a read only VO to show the priority:

Drag & Drop as a read-only table with sorting enabled:

We won’t use the outputText, but we’ll reuse the binding that is created.

Select the gauge component from the Component Palette & drag and drop it in the column.

 In the wizard choose for the LED:

This generates an dvt:gauge component that is empty, now we need to set a few properties.

As value we set the #{row.prio} binding that the outputText created for us.

Change the inlineStyle to get the correct width & height.

Choose the colors that you wish to show for the different priorities. I choose red for 1, yellow for 2 and green for 3 as 1 being the highest priority and 3 being the lowest.

This results in the following code: 

If you run this, it will result in the following column in a table:

Very easy to read for the user and if you ticked the sorting you will see that the column is still sortable as you would have expected with a number as priority:

You can see the (not so impressive) results live here at the Oracle Public Cloud.