Looking at the image below, here's a fun little game to play if you're bored - move containerX between containerW and containerY, and then dividerA before containerW.
For additional fun, time yourself and see how long it takes you.
(SPOILER AHEAD) Moral of the game - there doesn't seem to be a way to simply move an element between containers, or on either side of it, unless the container is the very top element or if there is an element above the container that is anything but a container.
Short of the above, any attempt to place an element following or preceding a container will result in the element being placed inside the container.
Similarly, duplicating a container results in it being duplicated inside itself rather than next to itself.
When dealing with screens that have numerous elements and containers (to keep everything organized and "movable"), rearranging elements can be a pain.
Any hopes we can get this addressed relatively quickly? I can't imagine that it is so by design.
Thanks for the feedback here @27shutterclicks! I've filed a report with the dev team, I see how moving components around when using a bunch of containers is very frustrating. Will let you know here when there's a fix!
@Kabirdas Checking in to see if there is any progress on this?
I just tried to move some containers around again and trying to move any element after a container still causes the element to be placed inside the container.
As shown above, this becomes increasingly more challenging and time consuming when there are multiple containers next to each other with no other elements in between (which is often the case).
Expediting a fix for this would be greatly appreciated.
Hey @27shutterclicks! There hasn't been progress here yet, the team is aware that it's an issue and wants to address it but they've needed to focus on other features. It is on the to-do list though as part of continued improvements to the mobile IDE.
The only options are copying or duplicating since it's not easy to move. When you copy or duplicate, all the IDs get duplicated, so if you are connecting it to any code, you now have to update the references to those new IDs (componentName2 for example instead of componentName).
That's a real pain -- is there a better way of doing this?
hey @cma@shawnhoffman circling back to confirm that this is a known issue, that dragging a component between two containers nests it in the top container, whereas it would be nice if the component tree UI made it easier for people to decide whether they wanted to nest a component or not. I wish I could offer you a better workaround, but the main one would be dragging everything to the top in reverse order.
I've shared both of your direct feedback and your +1 interest in better handling of moving elements between containers with our team on the existing tracker ticket internally. Thanks for expressing this friction point here, and we'll keep sharing customer feedback for visibility.
This topic is linked with the internal tracker ticket, so if any relevant updates happen we'll be able to circle back and share info here with you.
Circling back here to confirm that our design team made an update that hopefully makes this action more smooth and clear. The deep blue border line's depth (width) hopefully is enough of a visual hint to signify where the item will drop to -- whether dropping it within another container, or at the same level between two other containers:
