IBM WebSphere Multichannel Bank Transformation Toolkit, Version 7.1

Image

The Image widget is used to display images. You can also provide a title for the image by specifying a value for the hint property.

Implementation base

The Image widget is a Dojo-based widget.

The image widget can also be implemented by using the HTML <img> tag and the <div> tag with an image background.

Properties

The following properties can be configured for the Image widget.
Table 1. Properties that can be configured for the Image widget
Property Description
dataName The dataName property is the name of the data element to which the widget is bound. This property is optional.
styleClass The styleClass property specifies the class selector that is associated with the widget. If you do not configure the styleClass property, the default class selector is used instead.
visibility The visibility property defines how a widget is displayed on a GUI. The following values can be specified for this property:
visible
The widget is displayed on a GUI and users are able to interact with the widget.
hidden
The widget is not displayed on a GUI, but it occupies space on the GUI.
gone
The widget is not displayed on a GUI, and it does not occupy space on the GUI.
id The id is the identifier for the widget.
hint The hint is a description of the widget that is displayed as a tooltip for a user. The hint property has multilingual support.
location The location property specifies the relative path of the image.
width The width property specifies the width of the widget.
height The height property specifies the height of the widget.

Data mapping

If you specify the relative path of an image in the location property, the image is retrieved from the relative path that has been specified. If you specify a data element to which the image widget is bound in the dataName property, the image is retrieved from the location that is specified in the context.

ECA editor support

The following events and properties can be configured for the Image widget with the ECA editor.
Note: The ECA editor does not support functions for the Image widget.
Table 2. Events that can be added to the Image widget by using the ECA editor.
Event Description
onClick Is fired when the left mouse button is clicked.
onFocus Is fired when the widget receives focus because the user moves the mouse pointer over the widget.
onBlur Is fired when the widget does not receive focus, or when the user clicks outside the widget, or when the widget is hidden.
onMouseDown Is fired when a mouse button is clicked.
onMouseUp Is fired when a mouse button is released
onMouseEnter Is fired when the mouse pointer moves over the widget.
onMouseLeave Is fired when the mouse pointer moves out of the widget.
onMouseMove Is fired when the mouse pointer moves over nodes that are contained in the widget.
Table 3. Properties that can be configured for the Image widget by using the ECA editor.
Property Description
location The location property specifies the relative path of the image.


Feedback