UMG - Align dynamically created child widgets to center of screen

Development Programming & Scripting Blueprint
1

I have a scenario where a main widget is spawning children menu widgets but first “wrapping” (as a child) them in a “container” widget. The idea is that these submenus will fade in and out and I want to re-use the same animation for all of them, so I wrap them in the “Container” before adding them to the main widget.

Hopefully that made sense. So the flow is this:

  1. “Main” widget is created and added to viewport

  2. “Main” widget creates a “MenuContainer” widget and “MenuOne” widget

  3. “MenuOne” is added as a child to “MenuContainer” and “MenuContainer” is added as a child to “Containing Border”, an Overlay Panel inside the “Main” widget.

  4. User presses the button on “MenuOne” which calls “SwitchToTwo” on the “Main” widget.

  5. “SwitchToTwo” on the “Main” widget calls “Switch” on the “MenuContainer”. It then goes through steps 2 and 3 but with “MenuTwo”

  6. “Switch” on the “MenuContainer” triggers an animation to fade out the widget and move it to the right over 1 second. When the animation finishes, the widget removes itself.

  7. User presses the button on “MenuTwo” which calls “SwitchToOne” on the “Main” widget. Repeat steps 5 and 6 but with the other widget.

Here is the “Main” widget
Designer: https://i.imgur.com/L5abhIA.png
Graph: https://i.imgur.com/qYb0crV.png

Here is the “MenuContainer” widget
Designer: https://i.imgur.com/r7izXbS.png
Graph: https://i.imgur.com/X4tgYxO.png

Here is the “MenuOne” widget
Designer: https://i.imgur.com/1crzs2F.png
Graph: https://i.imgur.com/Nll1LxH.png

MenuTwo is the same as MenuOne except there’s no vertical box and only 1 line of text.

The problem occurs because MenuOne and MenuTwo are two different sizes. When transitioning from MenuOne to MenuTwo, MenuTwo is shifted to the upper-left corner while MenuOne is fading out. When MenuOne is done with the animation, MenuTwo is then corrected to the center. I want MenuTwo to start and stay in the center, regardless of any other widgets in the Overlay panel.

Here’s a video of what I’m talking about:https://youtube.com/watch?v=kZQ2rwh1DqQ
I wrapped the Main/MenuContainer/Menu# widgets in Red/Green/Blue borders to make it more clear which container is which. It seems to me like the problem is that MenuTwo is not being vertically aligned within the Main widget’s ContentContainer even though it’s set to center vertically. I don’t know how I might resolve this.

Does anyone have any potential fixes or maybe another way I could accomplish this?