Select to view content in your preferred language

Custom Popup

899
4
Jump to solution
01-26-2023 02:04 PM
DuanePfeiffer
New Contributor III

Trying to figure out how to create a custom popup when user taps on a feature in the map.  In my v 100.x code, I created a PopupDefinition object and set its title and customDescription (html).  V200.x has no customDescription.  It appears that I could build a list of fields?, but it is read-only.  Some guidance would go a long way here please.

EDIT: To clarify, I want to limit the fields that are shown in the popup as well as add text that is not in the field data.

0 Kudos
1 Solution

Accepted Solutions
MarkDostal
Esri Regular Contributor

Thank you for your question!  The easiest way to display popups is to define them in your web map and consume them in your application.  The Swift Toolkit has a `PopupView` which does exactly that.  You can find it here. It uses the array of `PopupElement`s defined in the `PopupDefinition` (loaded from the web map) to display the feature information.  There is a popup example in the Toolkit's Example app that shows how it's used.

If you are not using a web map, you will need to create the `PopupElements` you need and add them to the `PopupDefinition`'s `element` property.  The following are the possible element types:

  • TextPopupElement - displays text (including HTML strings)
  • FieldsPopupElement - displays a list of field data
  • AttachmentsPopupElement - displays feature attachments
  • MediaPopupElememt - displays images and charts

There is one additional type, `ArcadePopupElement`, that is not displayed, but when evaluated creates one or more elements of the other types.

The `TextPopupElement` will take an HTML (or regular) string, and display it in the same way the the v100.x `customDescription` did.

Once you have the elements defined in the popup definition you can create a popup and use that with the Popup Toolkit component. You can also use the Popup view Toolkit code as a guide if you want to build your own popup view.

Feel free to reach out if you need more information.

Mark

View solution in original post

0 Kudos
4 Replies
MarkDostal
Esri Regular Contributor

Thank you for your question!  The easiest way to display popups is to define them in your web map and consume them in your application.  The Swift Toolkit has a `PopupView` which does exactly that.  You can find it here. It uses the array of `PopupElement`s defined in the `PopupDefinition` (loaded from the web map) to display the feature information.  There is a popup example in the Toolkit's Example app that shows how it's used.

If you are not using a web map, you will need to create the `PopupElements` you need and add them to the `PopupDefinition`'s `element` property.  The following are the possible element types:

  • TextPopupElement - displays text (including HTML strings)
  • FieldsPopupElement - displays a list of field data
  • AttachmentsPopupElement - displays feature attachments
  • MediaPopupElememt - displays images and charts

There is one additional type, `ArcadePopupElement`, that is not displayed, but when evaluated creates one or more elements of the other types.

The `TextPopupElement` will take an HTML (or regular) string, and display it in the same way the the v100.x `customDescription` did.

Once you have the elements defined in the popup definition you can create a popup and use that with the Popup Toolkit component. You can also use the Popup view Toolkit code as a guide if you want to build your own popup view.

Feel free to reach out if you need more information.

Mark

0 Kudos
MarkDostal
Esri Regular Contributor

| EDIT: To clarify, I want to limit the fields that are shown in the popup as well as add text that is not in the field data.

You can use the `FieldsPopupElement` to display your list of fields.  It has one initializer, _public convenience init(fields: [PopupField] = [])_ that takes the list of fields to display.

You would create the fields popup element (and a TextPopupElement if desired) and add them to the PopupDefinition.

One important thing to note if you are writing your own popup view: you *must* call `Popup.evaluateExpressions` prior to displaying the popup.  This call does all the variable substitutions needed along with evaluating all Arcade expressions.  The `Popup.evaluatedElements` property will contain the list of elements for display.

0 Kudos
DuanePfeiffer
New Contributor III

Ok, I'm getting somewhere now.  However, there is still the 'Fields' Disclosure group.  If I could just get the 'Fields' group to collapse I would be set.  I set the isExpanded state variable to false but it is still expanded.

 

Thanks

0 Kudos
MarkDostal
Esri Regular Contributor

When/where are you setting the `isExpanded` variable to false?  SwiftUI should take care of that automatically when you click on the default chevron in the Disclosure Group header.  Here's the code from the Toolkit for the FieldsPopupElement.

https://github.com/Esri/arcgis-maps-sdk-swift-toolkit/blob/fb8b3e439537fe7bf38e4325e4ac781f9f61ea0a/...

If you still can't get it to work, sending a code snippet would be helpful in trying to debug it with you.

Mark

0 Kudos