Component with Nested Absolute Position Inside Auto Layout Not Respecting Layer Order

Ask the community
1

SUMMARY:
In UntitledUI, the dropdown menus use absolute positioning to position the “Open” state menu that appears. As you can see in the GIF below, when the menu expands (exposing the absolute position dropdown) the menu goes behind the other elements in the auto layout stack. It does not matter if the ❖ input dropdown’s position in the layer stack has no impact on the result.

STEPS TO REPRODUCE:

  1. Create a ❖ component with an absolution position element in side of it
  2. Add the ❖ component to a frame, and add an item above and below it
  3. Apply auto layout to the ❖ component and the two other elements
  4. Make sure the ❖ components absolution position element is shown

EXPECTED RESULT:
I expect the ❖ component and all elements inside of the ❖ component to appear above any element that is below it in the layer stack.

ACTUAL RESULT:
The ❖ component’s absolute position elements are appearing below the other elements in the auto layout stack.

DEMO:
absolutePosition-in-autoLayout

How are you working around this? How can we use Absolute Positioned elements in combination with Auto Layout?

2 Likes
2
3 Likes
3

Thank you @tank666. I had not seen that setting before.

For anyone who finds this thread, here is how to find Advanced Auto Layout Stack setting
image

2 Likes