Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Toolbars

Description

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 and a toolbar can be split using <item>|</item> which will split the toolbar/statusbar over multiple lines.

Note

To be valid xml the > in ->

...

should be escaped, so you

...

should really use either <item>

...

-&gt;</item> or <item><!

...

[CDATA

...

[-

...

>]]></item>, but the Weave config file reader is a bit more forgiving and will allow you to use ->, just remember that you may have problems if you try and validate the xml file.

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 toolbar will be placed at

...

the top of the area that it's been added to. To move it to the bottom add a statusbar instead, they're exactly the same as a toolbar.

Namespace

urn:com.cohga.html.client#1.0

Tags

toolbar | statusbar

Properties

...


Name

Type

Required

Description

scale

string

no

'small', 'medium' or 'large', default is 'small'.

Adjusts the size of the buttons in the toolbar/statusbar.

This value can also be set at the top level in a client config to set it for every toolbar/statusbar in the client.

iconAlign

string

no

'top', 'bottom', 'left' or 'right', default is 'left'.

Adjusts the alignment on the images within the buttons in the toolbar/statusbar.

This value can also be set at the top level in a client config to set it for every toolbar/statusbar in the client.

Sub-tags

Name

Type

Cardinality

Description

item

urn:com.cohga.html.client#1.0:item

Client Actions

0..*

A place holder for either an Action or Component

Content

None

...

Examples

Code Block
xml
xml
titleA Basic toolbar definition
linenumberstrue

<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> <!-- move this off to the right -->
    <item actioncomponent="com.cohga.html.client.actionscomponents.reportAction"/loadingComponent"/>
    <item>|</item> <!-- put the next items on their own line -->
    <item action="com.cohga.html.client.actions.gridActionreportAction"/>
    <item>-&gt;</item>
    <item componentaction="com.cohga.html.client.componentsactions.loadingComponentgridAction"/>
</toolbar>


Code Block
xml
xml
titleAdding a toolbar to a layout region
Code Block
xmlxmllinenumberstrue
<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>


Code Block
xml
xml
titleAdding a toolbar to the application
linenumberstrue
<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>

Here is the sample of the select tools inside the toogle button

Code Block
xml
xml
titleCreating a sub-toolbar
linenumberstrue

<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>


Code Block
xml
xml
titleAnd maybe a Navigation Group
Code Block
xmlxmllinenumberstrue

<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>

...