Skip to content

UI.Area

Name Mandatory Description Default Type
⬅️ Input The input of the shard, if any Any
Output ➡️ The resulting output of the shard Any
Contents No The UI contents. none NoneShard[Shard]
Position No Defines the position of the UI element. If 'Anchor' is set, this acts as a relative offset (X/Y). Accepts fixed and variable float2 types. none Float2Var(Float2)
Pivot No Specifies the pivot point of the UI element. Can be any predefined anchor type or variable. none AnchorVar(Anchor)
Anchor No Determines the side of the screen where the UI element is anchored. Accepts predefined anchor types or variables. none AnchorVar(Anchor)
Order No Sets the rendering layer for the UI element. The default layer is 'background'. none Order
Constrain No Constrains the UI element to remain within the screen boundaries. Accepts a boolean value. false Bool
ForcedSize No Force area to be the given size, will update the area state none NoneFloat2Var(Float2)

Places UI element at a specific position.

Examples

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
GFX.MainWindow(Contents: {
  ; Setup
  GFX.DrawQueue = ui-draw-queue
  GFX.UIPass(ui-draw-queue) >> render-steps

  ; UI
  UI({
    UI.Area(Anchor: Anchor::TopLeft Contents: {
      "TopLeft" | UI.Label
    })
    UI.Area(Anchor: Anchor::Top Contents: {
      "Top" | UI.Label
    })
    UI.Area(Anchor: Anchor::TopRight Contents: {
      "TopRight" | UI.Label(Wrap: false)
    })
    UI.Area(Anchor: Anchor::Left Contents: {
      "Left" | UI.Label
    })
    UI.Area(Anchor: Anchor::Center Contents: {
      "Center" | UI.Label
    })
    UI.Area(Anchor: Anchor::Right Contents: {
      "Right" | UI.Label
    })
    UI.Area(Anchor: Anchor::BottomLeft Contents: {
      "BottomLeft" | UI.Label
    })
    UI.Area(Anchor: Anchor::Bottom Contents: {
      "Bottom" | UI.Label
    })
    UI.Area(Anchor: Anchor::BottomRight Contents: {
      "BottomRight" | UI.Label(Wrap: false)
    })
  })

  UI.Render(ui-draw-queue)

  GFX.Render(Steps: render-steps)
})


[warning] Missing downlevel flags: DownlevelFlags(VERTEX_AND_INSTANCE_INDEX_RESPECTS_RESPECTIVE_FIRST_VALUE_IN_INDIRECT_DRAW)
The underlying API or device in use does not support enough features to be a fully compliant implementation of WebGPU. A subset of the features can still be used. If you are running this program on native and not in a browser and wish to limit the features you use to the supported subset, call Adapter::downlevel_properties or Device::downlevel_properties to get a listing of the features the current platform supports.
[warning] DownlevelCapabilities {
    flags: DownlevelFlags(
        COMPUTE_SHADERS | FRAGMENT_WRITABLE_STORAGE | INDIRECT_EXECUTION | BASE_VERTEX | READ_ONLY_DEPTH_STENCIL | NON_POWER_OF_TWO_MIPMAPPED_TEXTURES | CUBE_ARRAY_TEXTURES | COMPARISON_SAMPLERS | INDEPENDENT_BLEND | VERTEX_STORAGE | ANISOTROPIC_FILTERING | FRAGMENT_STORAGE | MULTISAMPLED_SHADING | DEPTH_TEXTURE_AND_BUFFER_COPIES | WEBGPU_TEXTURE_FORMAT_SUPPORT | BUFFER_BINDINGS_NOT_16_BYTE_ALIGNED | UNRESTRICTED_INDEX_BUFFER | FULL_DRAW_INDEX_UINT32 | DEPTH_BIAS_CLAMP | VIEW_FORMATS | UNRESTRICTED_EXTERNAL_TEXTURE_COPIES | SURFACE_VIEW_FORMATS | NONBLOCKING_QUERY_RESOLVE,
    ),
    limits: DownlevelLimits,
    shader_model: Sm5,
}
[warning] Context has 31 commandBuffers at release (0 released, 0 kept)
[warning] Context has 2 buffers at release (2 released, 2 kept)
[warning] Context has 5 textures at release (1 released, 5 kept)