Pop-up position relative to element that was clicked - recreating 'dropdown' object functionality

Ignition
,
1

The dropdown object in Perspective seems to open a new view that is always ~20 pixels below the text field. Regardless of the text field's position after being scaled or moved in flex container by resizing the session, or even if the option panel should show up outside of the dropdown's parent container, the option panel is always a specified distance beneath the text field.

I've been looking into a way to recreate this functionality, so that I can implement similar option panels on any object that is clicked. From what I've read on the forum and seen in the User Manual, I can't see how it is possible. Yet the dropdown achieves this.

The built-in pop-up event uses a location relative to the mouse coordinates, not relative to the clicked element. Determining the clicked element's top-left corner position is not possible in most cases without the use of the session's height and width in pixels, since the elements themselves use % values for position.

I feel like this is a common use-case, in web development and in UI development, but I am stuck. If anyone has some insight I would appreciate it!

2

The Popup Action allows for specifying a relative position. The sibling scripting function does not allow for this at this time.

If you're just trying to open a Popup below some component, you could manage this as long as the origin component is in a Coordinate Container (in fixed mode):

# where self is the originating component
position = {"left": self.position.x,"top": self.position.y + self.position.height}
system.perspective.openPopup(id="somethingUnique", view="MyPopupView", position=position)

Note this will not work outside of a Coordinate Container because you don't have access to the position properties you need.

1 Like