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. This 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 have a UI element always at the top left 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 can have an Anchor, which you can visualize through the Anchor Medallion, a white flower-like shape in the Designer tab, when you select said element:

Figure 8.10: The Anchor Medallion...