XUI editor

The IBM® WebSphere® Multichannel Bank Transformation Toolkit XUI editor is a WYSIWYG (what you see is what you get) tool that enables you to design and create user interfaces. XUI is an abbreviation for XML User interface.

The XUI editor creates WebSphere Multichannel Bank Transformation Toolkit XML-based transaction UI files, which are .xui files. The .xui files are in XML format at development time, and are then converted to Web 2.0 and SWT widgets at runtime by the WebSphere Multichannel Bank Transformation Toolkit XUI engine.

The XUI files are channel-neutral, which means that they can be converted into channel-specific UI files that comply with the technologies of different channels.

The XUI editor consists of the following five parts:
XUI editor area

The XUI editor area enables you to design GUIs. You can drag and drop the widgets and containers from the Palette to the XUI editor area to design GUIs.

If you click a widget or container element in the XUI editor area, you can edit the properties of the element in the Properties view.

Package Explorer
The Package Explorer view, shown by default in the Java perspective, shows the Java element hierarchy of the Java projects in your workbench. It provides you with a Java-specific view of the resources shown in the Navigator.
Palette

The Palette view contains the widgets and the containers that enable you to create an XUI file.

To add the Palette view to the current perspective, click Window > Show View > Palette.

Outline

The Outline view displays an outline of the XUI file that is currently open in the XUI editor area, and it lists the widget and the container elements of the XUI file.

If you click a widget or container element in the Outline view, you can edit the properties of the element in the Properties view.

To add the Outline view to the current perspective, click Window > Show View > Other... > General > Outline.

Properties
The Properties view displays the properties of a selected widget or container. Edit the properties of the widget and container elements of your XUI file in the Properties view.

For more information on how to use the WebSphere Multichannel Bank Transformation Toolkit XUI editor to design and create user interfaces, refer to the following sections.