Using af:commandImageLink inside af:toolbar

I just discovered a cool thing about the af:commandImageLink component, which I haven't seen explicitly documented. At least, the application developer's guide doesn't mention it, nor have I seen it in other blogs or code samples, so here goes.

The commandImageLink component can be included as part of an af:toolbar component as well. The section about toolbars in application developer's guide seems to mention usage of toolbar buttons as well as commandButton and commandLink inside them. Specifically, refer to following tip from that section:

Tip: Toolbars can also include command buttons and command links instead of toolbar buttons. However, toolbar buttons provide additional functionality, such as opening popup menus.

af:commandButton can also be associated with an optional icon. But, af:commandImageLink provides additional capability of optionally associating different icons on hover and depressed events. This functionality of potentially associating with 3 different icons can also be used with af:commandToolbarButton. As explained in the tip above, toolbar buttons come with extra potential functionality of popup menus. For users who don't care about extra baggage of popup menus, but desire a lightweight option inside af:toolbar (and potentially desire the option of being associated with multiple icons based on state), an alternative exists with af:commandImageLink.