NUI / Components / Layout

SafeZone

ImplementedLayout

SafeZone keeps one child inside configured screen-safe areas.

Supported as a one-child safe-area wrapper.

Overview

SafeZone keeps one child inside configured screen-safe areas.

When to use

HUD roots and screen-edge UI that should avoid unsafe display regions.

Children

Supports exactly one child.

nui

children {
    Text ChildText {
        text: "THIS IS THE CHILD COMPONENT"
    }
}

Basic syntax

nui

SafeZone HudSafeZone {
    titleSafe: true

    children {
        Text ChildText {
            text: "THIS IS THE CHILD COMPONENT"
        }
    }
}

Supported properties

Property	Type	Required	Default	Description
`titleSafe`	bool	No	false	Uses title-safe area rules.
`safeLeft`	bool	No	true	Applies left safe area.
`safeTop`	bool	No	true	Applies top safe area.
`safeRight`	bool	No	true	Applies right safe area.
`safeBottom`	bool	No	true	Applies bottom safe area.
`padLeft`	bool	No	false	Enables left safe-zone padding.
`padTop`	bool	No	false	Enables top safe-zone padding.
`padRight`	bool	No	false	Enables right safe-zone padding.
`padBottom`	bool	No	false	Enables bottom safe-zone padding.
`safeAreaScale`	number	No	1	Safe area scale multiplier.
`width`	number	No	Auto	Desired width.
`height`	number	No	Auto	Desired height.
`padding`	margin	No	margin(0)	Inner padding.
`visible`	bool	No	true	Visibility flag.

Contextual properties

Contextual property rules

SafeZone may receive stack, canvas, grid, wrap, or ExpandableArea slot properties only when it is authored as a direct child of the matching parent. See section 7.

Full syntax example

nui

SafeZone HudSafeZone {
    titleSafe: true
    safeLeft: true
    safeTop: true
    safeRight: true
    safeBottom: true
    padLeft: true
    padTop: true
    padRight: true
    padBottom: true
    safeAreaScale: 1
    width: 1280
    height: 720
    padding: margin(0)
    visible: true

    children {
        Text ChildText {
            text: "THIS IS THE CHILD COMPONENT"
        }
    }
}

Limitations

SafeZone must contain exactly one child.