Order
Last updated
Last updated
Children in a Screen, Component, or parent instance are drawn top-to-bottom, so that children further down are drawn on top.
Gum provides a number of ways to reorder instances.
Items can be right-clicked in the editor to change their order.
Bring to Front - reorders the instance so that it is in front of all of its siblings.
Move Forward - moves the instance in front of the sibling that is in front of it. In other words, moves the item forward by one index.
Move In Front Of - moves the instance in front of the selected sibling.
Move Backward - moves the instance behind the sibling that is currently behind it. In other words, moves the item backwards by one index.
Send to Back - reorders the instance so that it is behind all of its siblings.
Items can be re-ordered in the Project tree view by holding the alt key and pressing up or down.
Gum uses a hierarchical ordering which means that a parent and all of its children draw before any of the siblings of the parent. For example, a container and all of its children draw before any other siblings of the container.
The following animation shows a container named ContainerInstance2 which draws on top of ContainerInstance1. All children of ContainerInstance2 also draw on top of children of ContainerInstance1.
If a parent is reordered, then all of its children also respect the new order. For example, if ContainerInstance2 is sent to the back, then all of its children draw below ContainerInstance1 and its children.
If a parent uses a stack or grid layout for its Children Layout variable, then the order of the children in the Project tab determines their order in the stack or grid.
For more information, see the Children Layout page.
