A toolbar is a set of actions or components that are placed relative to each other. A toolbar can be placed inside any view, inside a layout region or at the top of the Application Windowapplication level.
An Action action can be rendered as a button or a tool.
...
A tool is used to interact with a particular View view on the screen. The user click the tool and it becomes active, the user then does some work with the view and the Action action then fires an Eventevent. This could be clicking on the zoomin tool, drawing a box an then the map changes its extent.
A Component component is a rendered piece of HTML code that presents custom features that and Action action cannot. e.g. a combobox with a list of active Entitiesentities, a list of scales, a loading indicator or a scalebar. Components are rendered using javascript and HTML.
A separator can be added to a toolbar by adding <item>-</item> and items can be right aligned by adding <item>-></item>. Note that to
| Note |
|---|
To be valid xml the |
...
should be escaped, so you |
...
should really use either |
...
|
...
|
...
|
...
|
Also, simple text can be added to a toolbar using <item>Label</item>.Recent updates to the client allow toolbars to be added to a region when setting up the layout, so when you're designing the layout and setting the north, south, east, west or center regions you can now add a toolbar (and statusbar) tag immediately below these tags. One caveat with this is that the
| Note |
|---|
The default tool for a map panel must be in the toolbar attached to the map view, it can't be in a toolbar defined in a layout region. |
| Info |
|---|
A |
...
the top of the area that it's been added to. To move it to the bottom add a |
Namespace
urn:com.cohga.html.client#1.0
Tags
toolbar | statusbar
Properties
None
Sub-tags
Name | Type | Cardinality | Description |
item | 0..* | A place holder for either an Action or Component |
Content
None
...
Example2
A Basic toolbar definition
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<toolbar>
<item action="com.cohga.html.client.actions.zoomInAction"/>
<item action="com.cohga.html.client.actions.zoomOutAction"/>
<item>-</item>
<item action="com.cohga.html.client.map.initialExtentAction"/>
<item action="com.cohga.html.client.map.fullExtentAction"/>
<item action="com.cohga.html.client.map.refreshMapAction"/>
<item>-</item>
<item action="com.cohga.html.client.actions.reportAction"/>
<item action="com.cohga.html.client.actions.gridAction"/>
<item>-></item>
<item component="com.cohga.html.client.components.loadingComponent"/>
</toolbar>
|
Adding a toolbar to a layout region
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<client:config> <perspective> <layout> <west> <name>toc</name> <type>fit</type> <west> <center> <name>map</toolbar> <type>fit</type> <toolbar> <item action="com.cohga.dms.ShowSelected"/> <item action="com.cohga.dms.ShowAllSelected"/> </toolbar> </center> </layout> .... </perspective> </client:config> |
Adding a toolbar to the application
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<client:config> <toolbar> <item action="com.cohga.dms.ShowSelected"/> <item action="com.cohga.dms.ShowAllSelected"/> </toolbar> <perspective> <layout> <west> <name>toc</name> <type>fit</type> <west> <center> <name>map</toolbar> <type>fit</type> </center> </layout> .... </perspective> </client:config> |
Creating a sub-toolbar
Here is the sample of the select tools inside the toogle button
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<item action="weave.toggleToolbar">
<iconCls>icon-selectfeatures</iconCls>
<toolbar>
<item action="com.cohga.html.client.map.select.rect.newAction"/>
<item action="com.cohga.html.client.map.select.rect.addAction"/>
<item action="com.cohga.html.client.map.select.rect.removeAction"/>
<item action="com.cohga.html.client.map.select.rect.refineAction"/>
<item>-</item>
<item action="com.cohga.html.client.map.select.circle.newAction"/>
<item action="com.cohga.html.client.map.select.circle.addAction"/>
<item action="com.cohga.html.client.map.select.circle.removeAction"/>
<item action="com.cohga.html.client.map.select.circle.refineAction"/>
<item>-</item>
<item action="com.cohga.html.client.map.select.polyline.newAction"/>
<item action="com.cohga.html.client.map.select.polyline.addAction"/>
<item action="com.cohga.html.client.map.select.polyline.removeAction"/>
<item action="com.cohga.html.client.map.select.polyline.refineAction"/>
<itemitem>
<item action="com.cohga.html.client.map.select.polygon.newAction"/>
<item action="com.cohga.html.client.map.select.polygon.addAction"/>
<item action="com.cohga.html.client.map.select.polygon.removeAction"/>
<item action="com.cohga.html.client.map.select.polygon.refineAction"/>
<itemitem>
<item action="com.cohga.html.client.map.select.clearAction"/>
<item action="com.cohga.html.client.map.select.clearAllAction"/>
<itemitem>
<item action="com.cohga.html.client.map.select.zoomAction"/>
<itemitem>
<item action="com.cohga.html.client.actions.bufferAction"/>
</toolbar>
</item>
|
And maybe a Navigation Group
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<item action="weave.toggleToolbar">
<iconCls>icon-world</iconCls>
<align>tl-bl</align>
<pressed>true</pressed>
<toolbar>
<item action="weave.previousExtent"/>
<item action="weave.nextExtent"/>
<item action="weave.initialExtent"/>
<item action="weave.fullExtent"/>
<item action="weave.zoomIn"/>
<item action="weave.zoomOut"/>
<item action="weave.pan" isDefault="true"/>
<item action="weave.refreshMap"/>
</toolbar>
</item>
|
...