2D, text and UI

2D is not a separate framework bolted on the side. Sprites, shapes and text are controls in the same panel tree as 3D models, drawn in the Overlay phase of the same frame, and positioned in design resolution so a layout written once holds on a phone and on a 4K monitor.

The control set

Five types cover everything the engine draws in two dimensions. They all derive from Control, which means they share the placement fields, the Enable flag, the async Load contract and the OnClick handler with every 3D control.

Sprites. SpriteBase carries what both sprite types need: a Color tint, Ext for the file extension, OriginWidth and OriginHeight for the source pixel size, and SourceX/Y/Width/Height for drawing one cell out of a sheet. Clock advances a sprite-sheet frame, FlipX and FlipY mirror it, and TextureOverride takes a one-shot upload — a file path or already-decoded RGBA8 pixels — which the next update consumes and clears.

Showing what compute wrote. Storage textures produced by compute effects are registered under a compute:// name, and a Sprite2D can be pointed straight at one. That is the whole debug-view mechanism: no readback, no copy, no special control type.

// A normal image.
var badge = new Sprite2D { Name = "Assets/badge", Ext = ".png", PosX = 24, PosY = 24 };

// The ambient-occlusion buffer, on screen, as a sprite.
var aoView = new Sprite2D
{
    Name = Season.Rendering.Effects.GtaoEffect.TextureName,
    PosX = 20, PosY = 580, Width = 240
};

Volumes are the exception. Three-dimensional outputs use the compute3d:// prefix and live in a separate backend dictionary, so a sprite cannot display one directly — a slice kernel has to bridge it down to 2D first, which is exactly what Sdf3DViewEffect is for.

Billboards. Sprite3D lives in world space and sorts with the transparent pass. Mode chooses how it faces the camera: Spherical turns on both axes and always faces you, Cylindrical turns only around world Y so a tree or a nameplate stays upright, and None hands orientation entirely to the quaternion Rotation.

Shapes. ShapeType is Dot, Square, Circle, RoundRect, RectFrame, Gradual and GradualCircle. Circles and rounded rectangles are analytically antialiased rather than being scaled bitmaps, and Border sets the frame thickness. It is a deliberately small set: enough to build panel chrome without shipping a vector graphics engine.

Text is MSDF, only

There is one glyph pipeline, on every backend. Glyphs are rasterised into multi-channel signed distance fields at a fixed PixelRange of 4 and packed into the engine's own atlas, so text stays sharp at any scale and no per-size atlas is ever rebuilt. Scale is a free parameter, not a quality setting.

title = new Texts
{
    Content = "Settings",
    Color = Colors.DarkRed,
    Scale = Vector2.One * 1.2f
};
AddControl(title);

Inline colour. A small span markup is understood inside Content, which is enough to highlight one word without splitting a paragraph into three controls.

log.Content = "Build <span style='color:Red;font-weight:bold;'>failed</span> in 2.4s";

Streaming text. Append exists because token streams exist. It lays out only the new tail against a checkpoint of the layout state at the start of the current line, so an incremental append matches a full relayout pixel for pixel, including whole-word lookahead. That is what makes a language model's output land in a Texts control at token rate without rebuilding the paragraph sixty times a second.

Line breaking is script-aware: CJK breaks between characters, including the punctuation that lives outside the main unified block and must not start a line, while Latin breaks on whole words. Fonts are loaded with Font.CreateAsync(fileName, size) and several can be resident at once, with glyph metrics cached per font size and code point.

Panels

Panel is the composition unit for both 2D and 3D. It holds a list of child Panels and a list of Controls, and it is where a screen, a HUD or a whole scene is assembled. AddControl and AddPanel define load order; Layer and Order define drawing order. OnClose fires when the panel goes away, and SetMode lets a panel reconfigure itself without being torn down.

Every control accepts an OnClick and an OnTouch handler, and MouseOver is maintained for you. There is no separate UI event system, no bubbling model and no command pattern to learn: a button is a panel with a delegate on it.

Layers, order and the two domains

Draw order is explicit. Controls and panels that implement IRenderOrder sort by Layer, then Order, then insertion index — a stable, total order with no z-fighting between overlay elements and no surprises when a list is rebuilt.

RenderDomain decides when in the frame a control is drawn rather than where it sits in the tree.

Setting a 2D control to Scene is occasionally exactly right — a diegetic screen inside the world should be bloomed and graded with everything else. Setting a HUD to Scene is how you accidentally make your text ghost under TAA.

One layout, every screen

You lay out against DesignResolution, 1280×720 by default. What happens next depends on the platform, and the difference is worth knowing because it is the one place the 2D model is not identical everywhere.

The practical rule: anchor anything that must stay reachable to BasicResolution, and stretch backgrounds and edge decoration to ExtendResolution. That gives you letterbox-free layouts on a 20:9 phone without a second design.

Resizing recomputes Scale and ExtendResolution only; BasicResolution is deliberately left alone so a window drag does not reflow a mobile layout. Orientation changes come through a separate event.

Known gaps

• Absent No layout system. No flexbox, no constraints, no anchors, no docking. Positions are numbers you compute, which is fine for a HUD and tedious for a settings screen with forty rows.
• Partial Text entry delegates to the platform. Input raises the native keyboard through DeviceServices.Dialog.ShowKeyboard. There is no in-engine caret, selection or IME composition, so text editing looks like the operating system rather than like your game.
• Absent No accessibility surface. No screen reader tree, no focus ring, no keyboard navigation between controls.
• Absent No markup or styling language. Span colour is the whole of it. No rich text document model, no stylesheets, no data binding.