Introducing anchors
As you might be aware, video games are played on many different screen sizes with many different resolutions. Because of that, it is important to make sure that the menus you create can adapt to all these different resolutions effectively. That is the main purpose of Anchors.
Anchors allow you to specify how you want a UI element’s size to adapt as the screen resolution changes by specifying the proportion of the screen you want it to occupy. Using anchors, you can always have a UI element in the upper-left corner of the screen, or always occupying half of the screen, no matter the size and resolution of that screen.
As the size of the screen or resolution changes, your widget will scale and move relative to its anchor. Only elements that are direct children of a Canvas Panel
element can have an anchor, which you can visualize through the Anchor Medallion (which is a white flower-like shape in the Designer
tab) when you select said element: