Speedgeeking at European DevSummit Berlin 2023:
Four types of widget communication in ArcGIS Experience Builder
WidgetManager
Controlling the widget state
You can control the state of a widget on the UI by using the WidgetManager.
In the official samples repo, you can find a sample showing this approach. It's called 'Control the widget state'. It identifies
- sidebar widgets in your app and
- widgets living inside a controller widget and toggles if they appear expanded or collapsed.
The crucial point
Use an appAction
imported from the jimu framework to dispatch a openWidget
or closeWidget
action along with the widgetId via the global AppStore.
DataSourceManager
Sharing a data source
You can look at the same data source from several widgets throughout your app, but it takes some extra action to also share a selection programmatically applied on an map layer.
Here's a sample using this approach: 'Alternative select'. It uses Sketch to draw a graphic on the map and a slider to define a buffer around it. As it is connected to a FeatureLayer datasource on a web map,
- is selects all features contained in the buffer and
- makes the selection available for other widgets looking at the same datasource.
The crucial point
Use the DataSourceComponent
to catch the FeatureLayer datasource in the widget code. Then query the FeatureLayerView for the ObjectIDs of the widgets within the buffer and pushes them into the DataSourceManager via featureLayerDatSource.selectRecordsByIds()
.
Data Action
Send a data object
The data action takes a data object and sends it to another widget.
Here's a sample using this approach: 'Excel export'. The data implemented by the widget that wants to receive the data. If activated in another widget's backend, it show a up as a button in the actions menu. If clickt, it sends out the data.
The crucial point
.getInstance().updateStateValue(
Use an instance of MutableStoreManager
and updateStateValue()
with the data that is to be sent.
Message Action
Trigger an action
A widget can implement a piece of action, that is triggered by another widget. The action itself is configurable. While the config menu of the action is implemented in the widget implementing the action, it shows up in the backend of the widget, that triggers the action.
Here's a sample using this approach: 'Message subscriber'.
The crucial point
Use an appAction
imported from the jimu framework to dispatch a widgetStatePropChange
action along with the widgetId and the configured parameter via the global AppStore.