Rich UI handler parts include widgets. Each is a
customized, on-screen control, but the term widget also refers
to the variable declaration that creates the control. A widget can
contain business data and can respond to events.
For a list of widget types and details on each, see the EGL Language
Reference entries for the following packages:
- org.eclipse.edt.rui.widgets package, for widgets other EGL Dojo
widgets.
- dojo.widgets package, for EGL Dojo widgets for web applications.
- dojo.mobile.widgets package, for EGL Dojo widgets for mobile applications.
Also, you can get details on the widget-specific fields and functions
by inspecting the project files that contain the widget code.
- org.eclipse.edt.rui project, EGLSource folder, com.ibm.egl.rui.widgets
package.
- org.eclipse.edt.rui.dojo.widgets project, EGLSource folder, dojo.widgets
package.
- org.eclipse.edt.rui.dojo.mobile.widgets project, EGLSource folder,
dojo.mobile.widgets package.
When you want to use a widget of a specific type, use content assist:
- Type the widget name and a period.
- Press Ctrl-Space.
Note: Do not use widgets from both the dojo.widgets
and dojo.mobile.widgets in a single application. Use dojo.widgets
for the web, dojo.mobile.widgets for mobile applications.
Widget declarations and package names
When
you wish to declare a widget, EGL provides two ways to identify the
package in which the widget resides. Although those two ways are available
when you declare any EGL variable, special automation is available
in relation to widgets.
First, you can precede the name of the
widget type with the name of the package. Here is the format:
widgetName packageName.widgetTypeName;
- widgetName
- Name of the widget
- packageName
- Name of the package.
- widgetTypeName
- Name of the widget type
The
second way to identify the package is to include an
import statement
early in the source code. Here is the format, which requires, in place
of
widgetTypeName, either a wild card (*) to reference multiple
types or the name of a specific type:
import packageName.widgetTypeName;
Use
of a wild card in place of widgetTypeName adds unnecessary
code to the generated JavaScriptâ„¢ output
and is not recommended.
Avoiding a null pointer exception
A widget
is an EGL reference variable. When declaring a widget statically (without
the new operator), remember to specify a
set-values block ({}), as in the following example:
myButton Button{};
Creating additional widgets
You can create
your own widgets in either of two ways:
- You can code a Rich UI widget; that is, a Rich UI handler, stereotype RUIWidget.
- You can write an EGL external type that is based on JavaScript. The ability to use EGL external
types is useful for accessing preexisting JavaScript libraries.
Using the Widget type
The EGL Widget type
is used when defining a function that accepts a widget whose specific
type is not known at development time. The following (unrealistic)
example shows how such a function can use the EGL operators
isa and
as to
make available type-specific properties and functions; for example,
the
text property of the TextField type:
import com.ibm.egl.rui.widgets.TextField;
handler MyHandlerPart type RUIhandler{onConstructionFunction = initialization}
myHelloField TextField{readOnly = true, text = "Hello"};
function initialization()
myInternalFunction(myHelloField);
end
function myInternalFunction(theWidget widget in)
case
when (theWidget isa TextField)
myTextField TextField = theWidget as TextField;
myString STRING = myTextField.text + " World";
sysLib.writeStdOut(myString);
when (theWidget isa Button)
;
otherwise
;
end
end
end
The handler displays Hello world.
A
variable of type Widget must be declared before the widget is referenced
in a property; in particular, before the widget is referenced in an initialUI or children property.
(That rule does not apply to variables of specific widget types such
as Button or TextField.)
A variable of type Widget is compatible
with both Rich UI widgets and external-type widgets.