Time for action – styling label providers

The IStyledLabelProvider is used to style the representation of the tree viewer, as used by the Java outline viewer to display the return type of the method, and by the team's decorator when showing when changes have occurred.

1. Add the IStyledLabelProvider interface to the TimeZoneLabelProvider class, and create the getStyledText method. If the selected element is a Map.Entry that contains a ZoneId, add the offset afterwards in brackets:

   public class TimeZoneLabelProvider extends LabelProvider
    implements IStyledLabelProvider {
     public StyledString getStyledText(Object element) {
       String text = getText(element);
       StyledString styledString = new StyledString(text);
       if (element instanceof ZoneId) {
         ZoneId zone = (ZoneId)element;
         ZoneOffset offset = ZonedDateTime.now(zone).getOffset();
         styledString.append(" (" + offset + ")",
          StyledString.DECORATIONS_STYLER);
       }
       return styledString;
     }
   }

2. In order to use the styled label provider, it has to be wrapped within a DelegatingStyledCellLabelProvider. Modify the constructor, called from the create method of TimeZoneTreeView, as follows:

   treeViewer.setLabelProvider(
     new DelegatingStyledCellLabelProvider(
       new TimeZoneLabelProvider(ir)));

3. Run the Eclipse instance, open the Time Zone Tree View, and the offset should be shown, displayed in a different color:
   
4. To change the Font used by the view, the TimeZoneLabelProvider needs to implement the IFontProvider interface. JFace's FontRegistry can be used to return an italicized version of the default font. Add a FontRegistry parameter to the TimeZoneLabelProvider constructor, and implement the getFont method as follows:

   public class TimeZoneLabelProvider extends LabelProvider
    implements IStyledLabelProvider, IFontProvider {
     private final ImageRegistry ir;
     private final FontRegistry fr;
     public TimeZoneLabelProvider(ImageRegistry ir, FontRegistry fr){
       this.ir = ir;
       this.fr = fr;
     }
     public Font getFont(Object element) {
       Font italic = fr.getItalic(JFaceResources.DEFAULT_FONT);
       return italic;
     }
     // as before
   }

5. Modify the TimeZoneTreeView to instantiate and pass in the global FontRegistry from the JFaceResources class:

   // treeViewer.setLabelProvider(
   //  new DelegatingStyledCellLabelProvider(
   //   new TimeZoneLabelProvider(ir)));
   FontRegistry fr = JFaceResources.getFontRegistry();
   treeViewer.setLabelProvider(
    new DelegatingStyledCellLabelProvider(
     new TimeZoneLabelProvider(ir, fr)));

6. Run the Eclipse instance again, and now the time zones should be shown in an italic font.
   

What just happened?

By implementing the IStyledLabelProvider interface and wrapping it with a DelegatingStyledCellLabelProvider class, the style of the individual elements in the tree can be controlled, including any additions or style/colors of the item. The StyledText can render the string in different styles.

Although DecorationsStyler was used here, additional styles can be defined with the createColorRegistryStyler method of the StyledString class where the two arguments are keys in the global JFace ColorRegistry.

While colors can be changed on a character-by-character basis, the Font is shared for the entire string. That's because when the label is calculated, its size is calculated based on the assumption that the string is displayed in a single Font.

It's generally good programming practice to have the content or label providers use resource managers that are passed in at construction time. That way, the code can be tested using automated tests or other mock resources. Whether using the Eclipse 3.x or the Eclipse 4.x programming model, decoupling where the resources come from is key to testing.

Pop quiz – understanding JFace

Q1. What methods are present on LabelProvider?

Q2. What is the difference between the hasChildren and getChildren methods on the ContentProvider class?

Q3. What is an ImageRegistry used for?

Q4. How do you style entries in a TreeView?

Have a go hero – adding images for regions

Now that the basics have been covered, try extending the example as follows:

• Update the plug-in with a number of flag icons, and then create entries for the image registry. (The name of the time zone can be used for the key, which will make accessing it easier.)
• Display the name of the region in italics, but the time zones themselves in bold font.