ArcGIS Viewer for Flex - Widget Container tag

This page describes an older version, please read about the latest version at:
http://resources.arcgis.com/en/help/flex-viewer/concepts/

Tag description

<widgetcontainer>: This tag defines a widget container, which is a conceptual construct. It is not something directly visible in the Viewer user interface (UI). It enables widgets to be grouped for management purposes in the Viewer application. Widgets referenced within a widget container in the Viewer application's configuration file will have similar behavior in the Viewer UI, and will be located in the widget tray. For more information, see Widgets in the ArcGIS Viewer for Flex.

The tag has the following properties:

left—Number of pixels from the left side edge of the application window.
right—Number of pixels from the right side edge of the application window.
top—Number of pixels from the top edge of the application window.
bottom—Number of pixels from the bottom edge of the application window.
layout—Determines the widget layout in the container. There are four types, horizontal (default), vertical, fixed, and float.

The first four properties are similar to the Widget tag, that is, left, right, top, and bottom. For the <widgetcontainer>, they relate to the position of the widget container with respect to the main Viewer application window. For example, setting top="40" for a vertical widget container ensures that it doesn't overlap with the standard Header Controller.

The layout attribute refers to how multiple widgets display in the widget container (when their dialog windows are open) in the Viewer application. The following image shows each of the four layout options:

When a <widget> tag is a child to a <widgetcontainer> tag, it is managed by the widget container. Therefore, the widget inherits and follows the properties set for the widget container. In the following config.xml file code sample, the Find U.S. address and Find European addresses widgets are managed by a horizontal widget container:

<widgetcontainer layout="horizontal">
         <widget label="Find U.S. address"
             icon="assets/images/i_target.png"
             config="widgets/Locate/LocateWidget_US.xml"
             url="widgets/Locate/LocateWidget.swf"/>
         <widget label="Find European addresses"
             icon="assets/images/i_pin2.png"
             config="widgets/Locate/LocateWidget_EU.xml"
             url="widgets/Locate/LocateWidget.swf"/>
         ...
</widgetcontainer>

For information on the the <widget> tag and its attributes, see Widget tag.

Widgets can also be grouped within the widget container. This enables widgets to be collected together for organizational purposes in the Viewer UI. Widgets can be grouped in the widget container using the <widgetgroup> tag, which is a child tag to <widgetcontainer> and a parent tag to <widget>.

<widgetgroup> has the following attributes:

label—Name of the group.
icon—Icon used for the widget group in the widget tray. The default folder icon is i_folder.png.

In the following Extensible Markup Language (XML) configuration file code sample, the Find U.S. address and Find European addresses widgets are grouped in the Locators widget group:

<widgetcontainer layout="horizontal">
        <widgetgroup label="Locators">
            <widget label="Find U.S. address"
                icon="assets/images/i_target.png"
                config="widgets/Locate/LocateWidget_US.xml"
                url="widgets/Locate/LocateWidget.swf"/>
            <widget label="Find European addresses"
                icon="assets/images/i_pin2.png"
                config="widgets/Locate/LocateWidget_EU.xml"
                url="widgets/Locate/LocateWidget.swf"/>
            ...
        </widgetgroup>
    </widgetcontainer>

Widget groups appear in the Viewer UI widget tray with a folder icon. When clicked, a drop-down menu list displays its member widgets.

Screen shot showing the folder icon and drop-down menu list.

The ArcGIS Viewer for Flex can have multiple widget containers as part of its UI, and a widget container can have multiple widget groups. Note that widgets cannot be dragged and dropped from one widget container to another. Nor can widgets be dragged out of a widget container and added as part of the Viewer UI by the end user.

For more developer information on widgets, see Widget framework.

2/15/2012