Class V

Namespace: Velvet

Assembly: Velvet.Docs.dll

VNode builder DSL. Declarative UI construction API for composing element trees in C#.

public static class V

Inheritance: object

V

Methods

Anchored(Transform?, Camera?, Vector2?, bool, bool, LayerMask?, float?, string?, string?, string?, FiberElementProps?, StyleOverrides?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Screen-space element that tracks a 3D scene Transform's projected position every frame (the default screen-space projection mode). This is ordinary 2D UI with no inherent scene depth (unlike WorldSpace(Vector3, Quaternion?, Vector2?, VNode?[]?, string?, PanelFocusOrder), which renders content INTO the 3D scene and is occluded by it for free) — occlude opts into an explicit physics stand-in for that test. Forces position: absolute inline (dynamic left/top positioning has no other way to work; see AnchoredDriver.Attach) — pass layout classes for everything else.

AnimatePresence(VNode?[]?, string?, bool, float, float, int, AnimatePresenceMode, Action?): Container that supports mount / unmount animations. When a keyed child becomes null, removal is deferred until the exit animation completes.

Button(string?, string?, Action?, string?, string?, string?, bool?, StyleOverrides?, Func<VisualElement, Action>?, Func<VisualElement, VisualElement>?, string?, string?, string?, VNode?[]?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a Button. text and children can be combined. UI Toolkit's Button inherits from TextElement and keeps the text property and child VisualElements independently, so use children when declaring multiple children (e.g. icon + label) and text for text-only buttons.

Button(string, params VNode?[]): Shorthand overload: positional className + variadic children, building a Button with just a class string and children (e.g. an icon + label). For any other prop — notably onClick — use the long-form overload with named arguments.

Component(Func<VNode>?, string?): Embeds a function-style component ([Component] static VNode Foo()) into the VNode tree as a child node. Props are read from Stores / Context via hooks, so passing state/props through method arguments is not the supported pattern.

Component<TRef>(Func<VNode>?, Ref<TRef>, string?): Embeds a function-style component with parent-to-child ref forwarding. The child retrieves the ref via Hooks.ForwardedRef<THandle>() and exposes it through Hooks.UseImperativeHandle.

Component<TProps>(Func<TProps, VNode>, TProps, string?): Embeds a function-style component that receives a single TProps argument carrying the per-instance values (e.g. an item id plus a click handler). Use this overload for V.List iteration / per-item callbacks where Context-based prop distribution would require allocating a Provider node per item.

Custom<T>(string?, string?, string?, FiberElementProps?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates an element backed by a custom UnityEngine.UIElements.VisualElement subclass T, for control types the built-in factories (Div(string?, string?, string?, FiberElementProps?, StyleOverrides?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?), Label(string?, string?, string?, string?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?), …) do not expose. Long form: every prop is a named optional parameter. For the shorthand V.Custom<T>("class", child1, child2) form, see the params overload.

Custom<T>(string, params VNode?[]): Shorthand overload: positional className + variadic children, building a T element with just a class string and children. For any prop besides className, use the long-form overload with named arguments.

Div(string?, string?, string?, FiberElementProps?, StyleOverrides?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a VisualElement (generic container). Long form: every prop is a named optional parameter. For the shorthand V.Div("class", child1, child2) form, see the params overload.

Div(string, params VNode?[]): Shorthand overload: positional className + variadic children, building a div element with just a class string and children. For any prop besides className, use the long-form overload with named arguments.

DndContext(Action<DragStartArgs>?, Action<DragOverArgs>?, Action<DragEndArgs>?, Action<DragCancelArgs>?, DndCollisionDetection?, DragActivation?, string?, string?, string?, FiberElementProps?, StyleOverrides?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Drag-and-drop scope. A real container element (the FocusScope precedent: the element is the stable scope identity and cleanup anchor). Draggables and droppables pair with their nearest ancestor scope at event time; one drag may be active per mounted tree at a time. Any existing container can be a scope via props (DndContext) — this factory is convenience.

DragOverlay(VNode?[]?, string?): Portal-rendered drag preview. Expands to V.Portal(UILayer.Overlay) hosting a framework-positioned, picking-ignored positioner that is sized to the drag source at activation and tracks the pointer while a drag is active (hidden otherwise). Render preview content conditionally from state set in onDragStart/onDragEnd. Inherits V.Portal(layer:)'s editor-context degradation.

Draggable(string, object?, bool, DragMovement, DragActivation?, string?, string?, string?, string?, FiberElementProps?, StyleOverrides?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Drag source. The element itself is the drag node; it must sit (at any depth) under a DndContext(Action<DragStartArgs>?, Action<DragOverArgs>?, Action<DragEndArgs>?, Action<DragCancelArgs>?, DndCollisionDetection?, DragActivation?, string?, string?, string?, FiberElementProps?, StyleOverrides?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?) scope.

DropdownField(string?, string?, List<string>?, Action<string>?, string?, string?, string?, bool?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a DropdownField.

Droppable(string, object?, bool, string?, string?, string?, string?, string?, FiberElementProps?, StyleOverrides?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Drop target. Collides with the active drag's rect under the scope's collision strategy; accept-filtering stays app logic in the scope callbacks.

ErrorBoundary(Func<Exception, VNode>, VNode?[], string?): Helper that wraps children in an inline Error Boundary with the given fallback. Catches exceptions thrown during render of the child tree (including rethrows from pending Suspense resources via Hooks.Use) and renders the VNode produced by fallback instead. Useful for reducing boilerplate where introducing a dedicated [Component(IsErrorBoundary = true)] wrapper class would be overkill (e.g. a root boundary directly under Mount).

FocusScope(string?, string?, string?, bool, bool, bool, bool, FiberElementProps?, StyleOverrides?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Container element whose subtree is a focus scope. Deviation (documented): a renderless, sentinel-span scope is common elsewhere; Velvet's is a real VisualElement, because UI Toolkit containment needs a subtree root for the scoped focus ring and the membership test. Any existing container can be a scope via props (FocusScope) — this factory is convenience for when no container exists yet. Style it like any Div.

Fragment(VNode?[], string?): Fragment node. Returns multiple nodes without an enclosing wrapper element. When key is supplied, the Fragment's children participate in the parent's keyed sibling list as a single keyed unit: their identity is scoped by key so siblings under a Fragment with a different key do not collide, and per-child fiber state (Hooks, refs) is preserved across reorders of the keyed Fragments.

Image(string?, string?, string?, StyleOverrides?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates an Image element for displaying sprites or textures.

IntegerField(string?, int?, Action<int>?, string?, string?, string?, bool?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates an IntegerField for entering integer values.

Label(string?, string?, string?, string?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a Label.

Link(string, string?, string?, string?, VNode?[]?, bool, string?): Renders a button whose activation requests navigation.

ListFragment<T>(IReadOnlyList<T>, Func<T, int, string>, Func<T, int, VNode>, string?): Sibling-friendly variant of List<T>(IReadOnlyList<T>, Func<T, int, string>, Func<T, int, VNode>) that wraps the mapped nodes in a single FragmentNode so the result can sit inline among sibling nodes in one children list.

ListFragment<T>(IReadOnlyList<T>, Func<T, string>, Func<T, VNode>, string?): Sibling-friendly variant of List<T>(IReadOnlyList<T>, Func<T, string>, Func<T, VNode>) that wraps the mapped nodes in a single FragmentNode. Because a Fragment is a VNode that the reconciler expands inline, the result can sit among sibling nodes in one children list (e.g. V.Div("c", header, V.ListFragment(...), footer)) without an extra wrapper element.

ListView(string?, string?, string?, bool?, StyleOverrides?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a ListView (virtualized scrollable list).

List<T>(IReadOnlyList<T>, Func<T, int, string>, Func<T, int, VNode>): Builds a keyed VNode list from an indexed collection, mapping each item together with its index to a VNode.

List<T>(IReadOnlyList<T>, Func<T, string>, Func<T, VNode>): Builds a keyed VNode list from a collection by mapping each item to a VNode and attaching a stable per-item key. If renderer returns null for an item, the slot is included in the array but renders nothing: the reconciler's inline expansion drops it.

Memo<TProps>(Func<TProps, VNode>, TProps, Func<TProps, TProps, bool>, string?): Memoizes a component with a custom areEqual comparator. Embeds a props-receiving function component (the same shape as Component<TProps>(Func<TProps, VNode>, TProps, string?)) but supplies an explicit areEqual predicate that decides whether a parent re-render bails this component.

Memoized(Func<VNode>): Declares no dependency array, for a factory whose inputs are not expressible as one: a newly built node never reuses the cached subtree, so a call site inside a render body rebuilds every render.

Memoized(Func<VNode>, params object?[]?): Memoization node. Skips rebuilding the child subtree while the dependency array is unchanged. When key is omitted, the order of MemoNodes within the same component must remain stable, since identity is resolved by call order. If the order can change dynamically, use MemoizedWithKey(string?, Func<VNode>, params object?[]?) instead. This is distinct from Memo<TProps>(Func<TProps, VNode>, TProps, Func<TProps, TProps, bool>, string?), which memoizes a function-style component by props equality.

MemoizedWithKey(string?, Func<VNode>): Keyed variant of Memoized(Func<VNode>): declares no dependency array, under an explicit cache key.

MemoizedWithKey(string?, Func<VNode>, params object?[]?): Keyed memoization node. Provides a stable cache keyed by the supplied key.

Motion(string?, string?, string?, StyleTransitionConfig?, float?, EasingMode?, float?, Action?, VNode?[]?, FiberElementProps?, FiberEventBinding[]?, Func<VisualElement, Action>?, string?, string?, string?, Type?, IReadOnlyDictionary<string, string>?, string?, string?, string?, string?): Element targeted by an animation. Used inside AnimatePresence; toggles CSS classes on mount / unmount according to transition. The one exception is a variant initial/animate pair (see initial), which plays its mount enter on any Motion, standalone or not. When transition is null, StyleTransition.Fade is applied as the default. duration / easing can override individual fields of the transition preset (e.g. setting only the duration while keeping the preset's other fields). To disable animation entirely (immediate mount / unmount), pass transition: StyleTransitionConfig.None. Note: when DurationSec is 0 (including StyleTransitionConfig.None), delay is ignored and completion is immediate.

Mount(VisualElement, VNode): Mounts a VNode tree onto target, establishing it as a render root and performing the initial render. Dispose the returned MountedTree to unmount.

NavLink(string, string, string?, string?, string?, VNode?[]?, bool, bool, bool, string?): Adds current-location active styling to Link(string, string?, string?, string?, VNode?[]?, bool, string?).

Navigate(string, bool, string?): No element participates in layout while the active Router handles the target.

Outlet(object?, string?): Placeholder that renders the matched child route component of a nested route at this position.

Particles(ParticleSystem?, string?, string?, string?, PlayTrigger, float, StyleOverrides?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a Particles element that simulates effect in a hidden, framework-owned host and draws the live particles as textured quads inside the element — no camera, no world-space canvas, no render-pipeline coupling. The simulation host is instantiated on mount (its renderer disabled; only the simulation is consumed), destroyed on unmount, and recreated when effect changes.

Portal(string, VNode?[]?, string?): Renders children into the Portal target identified by targetId, detaching them from the surrounding DOM position so they mount under a different host element. targetId must reference an ID previously registered via FiberPortalRegistry.Register.

Portal(VisualElement, VNode?[]?, string?): Renders children into target — a container the caller already holds, rather than one published under a name. The React form: createPortal(children, container) takes the node itself, so two trees in one process cannot collide the way two registrations of one id do, and an element reached through a refCallback is a valid container without being named first.

Portal(UILayer, VNode?[]?, string?, PanelFocusOrder): Renders children into a framework-managed screen-space layer panel sorted around the app's main panel — one host panel per layer per reconciler, created lazily and destroyed with the reconciler. Like every portal, the children stay part of the LOGICAL tree: context and state cross the boundary, and an events: handler on a logical ancestor of the call site also fires for a pointer / key / focus event raised on a child, bridged synthetically across the separate host Panel. Relational group-/peer- variants and focus-within do NOT cross (they register their own native callbacks directly, bypassing the bridge), and responsive breakpoints evaluate against the layer panel's own width. Screen-space layers always composite over the 3D scene; UI that must sit among scene geometry is WorldSpace(Vector3, Quaternion?, Vector2?, VNode?[]?, string?, PanelFocusOrder)'s territory.

Provider<T>(ComponentContext<T>, T, VNode?[]?, string?): Provides a context value to the descendant subtree, visible to descendants that read the same context via Hooks.UseContext.

RadioButton(string?, bool?, Action<bool>?, string?, string?, string?, bool?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a RadioButton. An individual radio button used inside a RadioButtonGroup.

RadioButtonGroup(string?, int?, List<string>?, Action<int>?, string?, string?, string?, bool?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a RadioButtonGroup that materializes a set of radio buttons from a list of choices.

Route(string?, ComponentNode?, string?, Func<RouteLoaderContext, CancellationToken, VelvetTask<object>>?, LoaderMode, ComponentNode?, RouteDefinition[]?, string?, Func<RouteLoaderContext, string>?, bool): Path-based route definition. Declaratively expresses Velvet Router's nested routes and Loaders.

Routes(params RouteDefinition[]): Container for an array of RouteDefinition values. Aggregates routes declared via V.Route() into the route table consumed when configuring the Router.

SceneView(Camera?, string?, string?, string?, float, StyleOverrides?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a SceneView element displaying camera's output — the canvas-parity element. The framework owns the RenderTexture: it is sized to the element's laid-out pixel size (times resolutionScale), rounded up to reuse the existing texture across minor resizes (preserving the element's aspect ratio), resized when the element's geometry changes, assigned to camera.targetTexture while mounted, and released on unmount (restoring the camera's target only if it is still the framework's own texture). The output arrives through the element's background image, so background utilities and rounded corners apply to it.

ScrollView(string?, string?, string?, ScrollerVisibility?, ScrollerVisibility?, TouchScrollBehavior?, Action<VisualElement>?, Func<VisualElement, Action>?, VNode?[]?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a ScrollView. Long form: every prop is a named optional parameter. For the shorthand V.ScrollView("class", child1, child2) form, see the params overload.

ScrollView(string, params VNode?[]): Shorthand overload: positional className + variadic children, building a ScrollView element with just a class string and children. For any prop besides className, use the long-form overload with named arguments.

Slider(string?, float?, float?, float?, Action<float>?, string?, string?, bool?, Func<VisualElement, Action>?, Action<VisualElement>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a Slider.

Suspense(VNode?, VNode?[], string?): Boundary that displays fallback while a descendant declares a pending async resource via Use<T>(), until the resource resolves. A descendant behind a nested V.Suspense() is caught by that boundary instead, so it does not raise this one's fallback. On error, the failure is propagated to the nearest Error Boundary (a component that overrides RenderFallback).

Text(string?): Creates a text-only node. Materialized as a Label.

TextField(string?, string?, Action<string>?, string?, string?, string?, bool?, bool?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?, string?, int?, bool?, bool?): Creates a TextField.

Toggle(string?, bool?, Action<bool>?, string?, string?, string?, bool?, Func<VisualElement, Action>?, string?, string?, string?, IReadOnlyDictionary<string, string>?, IReadOnlyDictionary<string, string>?): Creates a Toggle.

VirtualList<T>(IReadOnlyList<T>, Func<T, string>, float, Func<T, VNode>, int, string?, string?, string?): Virtualized list component for rendering large item collections. Renders a fixed-height-item ScrollView and only places the visible range in the DOM (a virtualized list).

When(bool, Func<VNode>?): Conditional rendering. Returns null when condition is false (handled by the Reconciler's null filter).

WorldSpace(Vector3, Quaternion?, Vector2?, VNode?[]?, string?, PanelFocusOrder): Renders children into a framework-owned world-space panel positioned by a scene transform — UI that lives among 3D content and is depth-tested against it, unlike the always-on-top screen-space layers. The host (GameObject + world-space panel) is created on mount, follows position / rotation updates, and is destroyed on unmount. Children stay part of the logical tree: context and state cross, and an events: handler on a logical ancestor of the call site also fires for a pointer / key / focus event raised on a child, bridged synthetically across the separate host Panel. Velvet does not arbitrate world-space pointer DELIVERY itself the way it does screen-space layer picking order: a BoxCollider sized to the panel is attached to the host, and Unity's own runtime input system drives picking and delivery through it once a Play session is running (see the package's cross-panel input routing docs). The event bridging above applies to whatever that system delivers, as well as to a programmatically dispatched event (e.g. in tests).

Table of Contents

Class V

Methods