Mask Component Reference

    Select a node in the Hierarchy panel, then click the Add Component button at the bottom of the Inspector panel and select Mask from UI -> Render. Then you can add the Mask component to the node.

    RECT

    mask

    ELLIPSE

    It can also be set by code at runtime. Example:

    GRAPHICS_STENCIL

    It can also be set by code at runtime. Example:

    IMAGE_STENCIL

    mask

    It can also be set by code at runtime. Example:

    1. After adding the Mask component to a node, all nodes in the sub tree of this node will be affected by Mask during rendering.
    2. The GRAPHICS_STENCIL simply provides the graphics component, which developers can use graphics property in the mask component to draw custom graphics. But the node click events are still calculated based on the size of the node.
    3. In the current version and previous versions, due to the underlying rendering architecture, the rendering content of all sub-nodes of Mask in the editor is invisible. The solution is to adjust the layer of the Mask node in the editor to default, which will not affect the runtime data.