Extending : Widget extension : Widget extension samples : Account widget sample
  
Account widget sample
The Account widget is a more complex than the ToggleButton widget, and it consists of two Label widgets and a SelectList widget.
Sample Account widget
This graphic is described in the surrounding text.
When selecting an account number from a list, the balance of this account is displayed automatically. This composite widget can be reused in multiple scenarios, including account transferring and payment so that a functional developer does not need to create the three widgets and ECA rule for every scenario.
More advanced topics are covered in this sample. Listed below are tasks that are covered in this sample:
Creating a figure class for widget.
Creating a new widget definition .xml file for the widget.
Registering widget extension point in plugin.xml.
Implementing a customized property editor.
Implementing a customized property mapping rule.
Creating widget functions and events.
Creating a widget mapping file.
Add widget mapping extension point in plugin.xml.
Implement jsp handler class for the widget.
Implement JavaScript code for the widget.
Modify template.jsp to add required js implementation for the widget.
Create alphadojo.tld to add extended jsp tags for the widget.
The implementation items of this sample are in two projects:
AlphaSampleWidegt.zip
AlphaTest.zip
Implementation items included in the Account sample
AccountWidget.xml
Widget Definition file
Location: widget folder in AlphaSampleWidget project
See also: Defining a widget
AccountWidgetFigure.java
Figure implementation of widget
Location: src/com/ibm/btt/alphasample/editor/figure/ folder in AlphaSampleWidget project
See also: Displaying a widget in the XUI editor
Account.gif
Icon used to show Account widget in XUI Editor Palette
Location: icon folder in the AlphaSampleWidget project
See also: Importing a widget
AccountWidget.PNG
Image used to show Account widget in XUI Editor Canvas
Location: image folder in AlphaSampleWidget project
See also: Importing a widget
ColorCellEditor.java; ColorPropertyDescriptor.java; SimpleColorPropertyDescriptor.java
Color property editor implementation
Location: src/com/ibm/btt/alphasample/editor/properties/desc folder in AlphaSampleWidget project
See also: Customizing a property editor
Account widget extension point
Extension point registration of Account widget
Location: Extensions tab of plugin.xml in the AlphaSampleWidget project
See also: Importing a widget
alphaMapping.xml
Define widget mapping in the file
Location: configure folder in the AlphaSampleWidget project
See also: Creating and registering widget mappings
RGBValueRule.java
Customize property mapping rule
Location: src/com/ibm/btt/alphasample/editor/generator in the AlphaSampleWidget project
See also: Creating a customized property mapping rule
DojoAccountTag.java
JSP tag handler implementation for Account widget
Location: src/com/ibm/btt/alphatest/dojo/tag folder in the AlphaTest project
See also: Implementing and registering a JSP tag handler
alphadojo.tld
JSP tag handler registration
Location: WebContent/WEB-INF folder in the AlphaTest project
See also: Implementing and registering a JSP tag handler
Account.js
JavaScript implementation for Account widget
Location: WebContent/js/com/ibm/btt/dijit folder in the AlphaTest project
See also: Dijit implementation
Go up to
Widget extension samples