Skip To Content

Widget Controller widget

The Widget Controller widget is a container you can use to organize other widgets as buttons, managing their life cycle and display. You can change the direction of the widgets in the controller, either horizontal or vertical. You can also control the number of widgets that can be opened and how the widget buttons display.

Example

Use this widget to support app design requirements such as the following:

  • The Widget Controller widget is typically used in a full-screen, mapcentric app to organize widgets into a toolbar-like controller. End users can open one or more widgets to interact with the map when needed.

Usage notes

To add widgets to the controller, click the Add widget button and select from a widget gallery or drag a widget from the Insert widget panel onto the controller. Configure the added widgets by clicking the widget on the controller to open its settings panel. Drag the bottom corner of the widget panel to define its initial size. To remove widgets or change their order, click the Move/Remove widget button on the contextual toolbar to enable the operations.

Settings

The Widget Controller widget includes the following settings:

  • Direction—Display the controller in a vertical or horizontal direction.
  • Behavior—Define the number of widgets that can be opened from this controller and which widgets open automatically when the page is loaded.
    • Single—Only one widget can be opened at a time. Opening one widget will close another.
    • Multiple—Multiple widgets can be opened and run at the same time. In this case, you can choose to show open widgets stacked or side by side.
    • Enable one or more widgets to be opened automatically when the page is loaded by selecting from the widgets list.
  • Appearance
    • Icon style—Use a circle or rectangle for the widget icons.
    • Show label—Show the name of the widget as a label under the icon. This text will match the default name; edit the widget name in the configuration panel so it’s meaningful to end users.
    • Icon size—Change the size of the widget icon.
    • Icon interval—Specify the space between widget icons.
  • Advanced—Configure how the buttons on the toolbar appear for different states: Regular, Selected, and Hover. You can format the text in bold, italic, strikethrough, or underline, and change the font and icon background colors.
Note:

Your selected theme affects the default colors in the configuration panels. You can choose a custom color if you want to use a color that’s not part of the app’s theme.