Web AppBuilder for ArcGIS (Developer Edition)

Widget configuration

The following table shows widget attributes and descriptions for widget configuration.

AttributeDescription

id

String. If omitted, the viewer generates one.

label

String. The widget display name, such as Bookmark or Query.

uri

String. The widget main class, derived from BaseWidget. For example, widgets/Bookmark/Widget.

icon

String. If omitted, the default icon is images/icon.png. You can set this property to point to another PNG file. For example, configs/Bookmark/icon_bookmark1.png.

  • Do not define this property if you use a widget only once.
  • If you use a widget more than once, put the icon file in the app configs folder, and name it icon_{label}.png.

openAtStart

Boolean. Indicates whether the widget opens when the app starts. The default value is false. This is only valid for in-panel widgets.

config

String or object. The widget configuration. The format depends on the widget. It can be one of the following:

  • URL points to the config file.
  • Config object.

If omitted, the default config.json file in the widget folder is used. If it points to a config file such as config_<widget label>.json, it is recommended to put it in the configs/<widget name> folder.

  • Do not define this property if you use a widget only once.
  • If you use a widget more than once, put the configuration file in the widget folder and name it config_{label}.json.

version

If the version is older, the framework will run the widget's version manager to upgrade the old configuration.

closeable

Optional—Boolean. Only valid for the off-panel widget on the screen. If false, the widget loads and is located at the defined position. You can't close it. If true, the app creates an icon for the widget. You can click the icon to open and close it.

position

Optional—Object. Sets the position of the widget and is only valid for the on-screen widgets. There is no default value. If not set, the widget is positioned by itself. The panel and group have the same property.

The app container (framework) provides six properties to define a widget position: left, top, bottom, right, width, and height, although any four of them should be good enough. If one of these properties is configured, the app container applies it to the widget's domNode, and other properties are set to auto.

In addition, the position has four properties to define the widget padding: paddingRight, paddingLeft, paddingTop, and paddingBottom.

Besides the position and padding properties for a widget specified above, the position object has two other properties:

  • Optional—relativeTo. The value can be either map or browser. The default is map.
  • Optional—zIndex. If not set, the widget's z-index is auto. The value should be between 0 and 100.

Example:

"position": {
  "left": 10,
  "top": 10
}

Example:

"widgets": [{
      "id": "bookmark1",
      "uri": "widgets/Bookmark/Widget",
      "icon": "configs/Bookmark/icon_Mybookmark.png",
      "label": "My Bookmark",
      "openAtStart": true,
      "config": {
          "name": "Test",
          "extent": []
       },
       "version": "2.0",
       "position": {
          "left": 20,
          "top": 20
       }
}]