When creating own widgets, you typically start off by creating a custom widget type. As described in the previous sections, the dashboard is configured in terms of columns and widget states. Each widget state carries a widget type id which associates it with its widget type. In order to get from widget states to the actual widget instances shown on the dashboard, the different widget types are consulted. A widget type is responsible for creating the widget components from their associated widget states.
You could define your own widget type by creating a class from scratch that implements the
interface WidgetType. However, a convenient default implementation
ComponentBasedwidgetType, is provided out of the box. For many cases it is
sufficient to let your own widget type extend it. In order to do so, you have to define a
widget component that defines the UI for widgets of your new widget
type. For instance, the predefined SimpleSearchWidgetType is simply defined in
EXML as follows:
<exml:class ... >
...
<editor:componentBasedWidgetType
name="..."
description="..."
iconCls="...">
<editor:widgetComponent>
<editor:simpleSearchWidget/>
</editor:widgetComponent>
</editor:componentBasedWidgetType>
</exml:class>Example 7.53. Simple Search Widget Type
Besides setting the parameters name, description and iconCls,
the widget component SimpleSearchWidget is set. The following listing shows a
fragment of the SimpleSearchWidget:
<exml:component ...
baseClass="...SimpleSearchWidgetBase">
...
<exml:cfg name="searchText" type="String">
<exml:description>
...
</exml:description>
</exml:cfg>
<exml:cfg name="contentType" type="String">
<exml:description>
...
</exml:description>
</exml:cfg>
<exml:constant name="CONTENT_LIST_ITEM_ID" value="contentList"/>
<container height="100%">
<items>
<editor:widgetContentList itemId="{CONTENT_LIST_ITEM_ID}"
contentList="{getContentValueExpression()}"/>
...
</items>
</container>
</exml:component>Example 7.54. Simple Search Widget Component
The component can be configured with the parameters searchText and
contentType in order to show a corresponding search result. Executing the
search and obtaining the search results is carried out in the base class
SimpleSearchWidgetBase. When extending that class, a value expression that
references the search result can be obtained via getContentValueExpression()
and is used by a WidgetContentList to display the result.
There is one further important aspect concerning the base class
SimpleSearchWidgetBase. It implements the Reloadable interface.
This indicates that a reload button should be placed in the widget header, calling the
widget's reload() method for refreshing the widget's contents. In this case,
the base class simply triggers a new search.
 |  |  |
 |