October 13 2014

The af:listView ADF component is a nice alternative to tables, and with a small effort, can provide a more-modern look to your ADF web application. There is one minor feature missing, which you can add yourself quite easily: row banding. Row banding makes the listView easier-ro-read, especially when there are many details in a listItem, or when there are many items in the list, or when the list is very wide. 

As you can see, just like with a table, it helps offest the rows from each other visually on the right, as compared to without banding on the left. To get your listView to look like the above, just follow these easy steps. 

  1. Make your listView aware of even/odd styles

     
  2. Add styles for your listItems to your skin

Since the listView uses the background-color of the listItem as the property it changes to show selection, the last style will change the font-weight for the selected row. This could also change the style to italic or change the color of the text, it's up to you. Hopefully this will enhance the look of your ADF application and make your users happier and more productive. 

Join the Conversation

Enter your first name. It will only be used to display with your comment.
Enter your email. This will be used to validate you as a real user but will NOT be displayed with the comment.
By submitting this form, you accept the Mollom privacy policy.