Class: SketchPanel
Defined in: src/ui/interaction/SketchPanel.ts:21
A View that functions as a drawable canvas in 3D space. It uses
an HTML canvas as a texture on a plane, allowing users to draw on its surface
with their XR controllers. It supports basic drawing, undo, and redo
functionality.
Extends
Constructors
Constructor
new SketchPanel():
SketchPanel
Defined in: src/ui/interaction/SketchPanel.ts:36
Returns
SketchPanel
Overrides
Properties
aspectRatio
aspectRatio:
number=1.0
Defined in: src/ui/core/View.ts:75
The calculated aspect ratio (width / height) of this view.
Inherited from
draggingMode
draggingMode:
DragMode=DragMode.DO_NOT_DRAG
Defined in: src/ui/interaction/SketchPanel.ts:22
The dragging mode of this view, if any.
Overrides
height
height:
number=1
Defined in: src/ui/core/View.ts:45
The height of the view, as a 0-1 ratio of its parent's available space.
Inherited from
isQuad
isQuad:
boolean=true
Defined in: src/ui/core/View.ts:30
Flag indicating View behaves as a 2D quad in layout calculations.
Inherited from
isRoot
isRoot:
boolean=false
Defined in: src/ui/core/View.ts:32
Flag indicating if this is the root view of a layout.
Inherited from
isView
isView:
boolean=true
Defined in: src/ui/core/View.ts:34
Type identifier for easy checking with instanceof.
Inherited from
isXRScript
isXRScript:
boolean=true
Defined in: src/core/Script.ts:54
Inherited from
material
material:
MeshBasicMaterial
Defined in: src/ui/interaction/SketchPanel.ts:34
mesh?
optionalmesh:Mesh<BufferGeometry<NormalBufferAttributes,BufferGeometryEventMap>,Material<MaterialEventMap> |Material<MaterialEventMap>[],Object3DEventMap>
Defined in: src/ui/core/View.ts:73
The underlying THREE.Mesh if the view has a visible geometry.
Inherited from
name
name:
string='View'
Defined in: src/ui/core/View.ts:26
Text description of the view
Inherited from
opacity
opacity:
number=1.0
Defined in: src/ui/core/View.ts:71
The overall opacity of the view and its children.
Inherited from
paddingX
paddingX:
number=0
Defined in: src/ui/core/View.ts:62
Horizontal padding, as a 0-1 ratio of the parent's width.
Inherited from
paddingY
paddingY:
number=0
Defined in: src/ui/core/View.ts:64
Vertical padding, as a 0-1 ratio of the parent's height.
Inherited from
paddingZ
paddingZ:
number=0
Defined in: src/ui/core/View.ts:66
Depth padding, for z-axis adjustment to prevent z-fighting.
Inherited from
selectable
selectable:
boolean=true
Defined in: src/ui/core/View.ts:36
Determines if this view can be targeted by user input.
Inherited from
ux
ux:
UX
Defined in: src/core/Script.ts:53
Inherited from
weight
weight:
number=0.5
Defined in: src/ui/core/View.ts:41
Proportional size used in layouts like Row or Col.
Inherited from
width
width:
number=1
Defined in: src/ui/core/View.ts:43
The width of the view, as a 0-1 ratio of its parent's available space.
Inherited from
x
x:
number=0
Defined in: src/ui/core/View.ts:50
The local x-coordinate within the parent's layout, from -0.5 to 0.5. For root view (Panel), this will be addition to the global positioning.
Inherited from
y
y:
number=0
Defined in: src/ui/core/View.ts:55
The local y-coordinate within the parent's layout, from -0.5 to 0.5. For root view (Panel), this will be addition to the global positioning.
Inherited from
z
z:
number=0
Defined in: src/ui/core/View.ts:60
The local z-coordinate within the parent's layout. For root view (Panel), this will be addition to the global positioning.
Inherited from
dependencies
staticdependencies:object
Defined in: src/ui/interaction/SketchPanel.ts:23
user
user: typeof
User=User
Accessors
rangeX
Get Signature
get rangeX():
number
Defined in: src/ui/core/View.ts:82
Gets the effective horizontal range for child elements, normalized to 1.0 for the smaller dimension.
Returns
number
The horizontal layout range.
Inherited from
rangeY
Get Signature
get rangeY():
number
Defined in: src/ui/core/View.ts:91
Gets the effective vertical range for child elements, normalized to 1.0 for the smaller dimension.
Returns
number
The vertical layout range.
Inherited from
Methods
add()
add(...
children):SketchPanel
Defined in: src/ui/core/View.ts:225
Overrides THREE.Object3D.add to automatically trigger a layout update
when a new View is added as a child.
Parameters
children
...Object3D<Object3DEventMap>[]
Returns
SketchPanel
Inherited from
clearCanvas()
clearCanvas(
forceUpdate):void
Defined in: src/ui/interaction/SketchPanel.ts:154
Parameters
forceUpdate
boolean = true
Returns
void
dispose()
dispose():
void
Defined in: src/core/Script.ts:196
Called when the script is removed from the scene. Opposite of init.
Returns
void
Inherited from
dpToLocalUnits()
dpToLocalUnits(
dp):number
Defined in: src/ui/core/View.ts:128
Converts a value from Density-Independent Pixels (DP) to local units.
Parameters
dp
number
The value in density-independent pixels.
Returns
number
The equivalent value in local units.
Inherited from
getContext()
getContext():
CanvasRenderingContext2D
Defined in: src/ui/interaction/SketchPanel.ts:77
Returns
hide()
hide():
void
Defined in: src/ui/core/View.ts:142
Makes the view and all its descendants invisible.
Returns
void
Inherited from
init()
init(
__namedParameters):void
Defined in: src/ui/interaction/SketchPanel.ts:70
Init the SketchPanel.
Parameters
__namedParameters
user
Returns
void
Overrides
initPhysics()
initPhysics(
_physics):void|Promise<void>
Defined in: src/core/Script.ts:73
Enables depth-aware interactions with physics. See /demos/ballpit
Parameters
_physics
Returns
void | Promise<void>
Inherited from
onHoverEnter()
onHoverEnter(
_controller):boolean|void
Defined in: src/core/Script.ts:155
Called when the controller starts hovering over this object with reticle.
Parameters
_controller
An XR controller.
Returns
boolean | void
Whether the event was handled. If true, the event will not bubble up.
Inherited from
onHoverExit()
onHoverExit(
_controller):boolean|void
Defined in: src/core/Script.ts:161
Called when the controller hovers over this object with reticle.
Parameters
_controller
An XR controller.
Returns
boolean | void
Whether the event was handled. If true, the event will not bubble up.
Inherited from
onHovering()
onHovering(
_controller):boolean|void
Defined in: src/core/Script.ts:167
Called when the controller hovers over this object with reticle.
Parameters
_controller
An XR controller.
Returns
boolean | void
Whether the event was handled. If true, the event will not bubble up.
Inherited from
onKeyDown()
onKeyDown(
_event):void
Defined in: src/core/Script.ts:110
Called on keyboard keypress.
Parameters
_event
Event containing .code to read the keyboard key.
Returns
void
Inherited from
onKeyUp()
onKeyUp(
_event):void
Defined in: src/core/Script.ts:111
Parameters
_event
Returns
void
Inherited from
onObjectGrabbing()
onObjectGrabbing(
_event):void
Defined in: src/core/Script.ts:187
Called every frame a hand is grabbing this object.
Parameters
_event
Returns
void
Inherited from
onObjectGrabEnd()
onObjectGrabEnd(
_event):void
Defined in: src/core/Script.ts:191
Called when a hand stops grabbing this object.
Parameters
_event
Returns
void
Inherited from
onObjectGrabStart()
onObjectGrabStart(
_event):void
Defined in: src/core/Script.ts:183
Called when a hand starts grabbing this object (touching + pinching).
Parameters
_event
Returns
void
Inherited from
onObjectSelectEnd()
onObjectSelectEnd(
_event):boolean|void
Defined in: src/core/Script.ts:149
Called when the controller stops selecting this object the script represents, e.g. View, ModelView.
Parameters
_event
event.target holds its controller.
Returns
boolean | void
Whether the event was handled. If true, the event will not bubble up.
Inherited from
onObjectSelectStart()
onObjectSelectStart(
_event):boolean|void
Defined in: src/core/Script.ts:142
Called when the controller starts selecting this object the script represents, e.g. View, ModelView.
Parameters
_event
event.target holds its controller.
Returns
boolean | void
Whether the event was handled. If true, the event will not bubble up.
Inherited from
onObjectTouchEnd()
onObjectTouchEnd(
_event):void
Defined in: src/core/Script.ts:179
Called when a hand's index finger stops touching this object.
Parameters
_event
Returns
void
Inherited from
onObjectTouching()
onObjectTouching(
_event):void
Defined in: src/core/Script.ts:175
Called every frame that a hand's index finger is touching this object.
Parameters
_event
Returns
void
Inherited from
onObjectTouchStart()
onObjectTouchStart(
_event):void
Defined in: src/core/Script.ts:171
Called when a hand's index finger starts touching this object.
Parameters
_event
Returns
void
Inherited from
onSelect()
onSelect(
_event):void
Defined in: src/core/Script.ts:99
Called whenever pinch / mouse click successfully completes, globally.
Parameters
_event
event.target holds its controller.
Returns
void
Inherited from
onSelectEnd()
onSelectEnd(
event):void
Defined in: src/ui/interaction/SketchPanel.ts:98
Called whenever pinch / mouse click discontinues, globally.
Parameters
event
Returns
void
Overrides
onSelecting()
onSelecting(
event):void
Defined in: src/ui/interaction/SketchPanel.ts:117
Updates the painter's line to the current pivot position during selection.
Parameters
event
Returns
void
Overrides
onSelectStart()
onSelectStart(
event):void
Defined in: src/ui/interaction/SketchPanel.ts:85
Called whenever pinch / mouse click starts, globally.
Parameters
event
Returns
void
Overrides
onSimulatorStarted()
onSimulatorStarted():
void
Defined in: src/core/Script.ts:79
Returns
void
Inherited from
onSqueeze()
onSqueeze(
_event):void
Defined in: src/core/Script.ts:133
Called whenever gamepad trigger successfully completes, globally.
Parameters
_event
event.target holds its controller.
Returns
void
Inherited from
onSqueezeEnd()
onSqueezeEnd(
_event):void
Defined in: src/core/Script.ts:122
Called whenever gamepad trigger stops, globally.
Parameters
_event
event.target holds its controller.
Returns
void
Inherited from
onSqueezeStart()
onSqueezeStart(
_event):void
Defined in: src/core/Script.ts:117
Called whenever gamepad trigger starts, globally.
Parameters
_event
event.target holds its controller.
Returns
void
Inherited from
onSqueezing()
onSqueezing(
_event):void
Defined in: src/core/Script.ts:127
Called whenever gamepad is being triggered, globally.
Parameters
_event
Returns
void
Inherited from
onTriggered()
onTriggered(
_id):void
Defined in: src/ui/core/View.ts:240
Hook called on a complete select action (e.g., a click) when this view is the target. Intended for override by subclasses.
Parameters
_id
number
The ID of the controller that triggered the action.
Returns
void
Inherited from
onXRSessionEnded()
onXRSessionEnded():
void
Defined in: src/core/Script.ts:77
Returns
void
Inherited from
onXRSessionStarted()
onXRSessionStarted(
_session?):void
Defined in: src/core/Script.ts:76
Parameters
_session?
Returns
void
Inherited from
physicsStep()
physicsStep():
void
Defined in: src/core/Script.ts:74
Returns
void
Inherited from
redo()
redo():
void
Defined in: src/ui/interaction/SketchPanel.ts:187
Returns
void
removeAll()
removeAll():
void
Defined in: src/ui/interaction/SketchPanel.ts:163
Returns
void
resetLayout()
resetLayout():
void
Defined in: src/ui/core/View.ts:205
Resets the layout state of this view. Intended for override by subclasses.
Returns
void
Inherited from
resetLayouts()
resetLayouts():
void
Defined in: src/ui/core/View.ts:208
Resets the layout state for this view and all its descendants.
Returns
void
Inherited from
show()
show():
void
Defined in: src/ui/core/View.ts:134
Makes the view and all its descendants visible.
Returns
void
Inherited from
triggerUpdate()
triggerUpdate():
void
Defined in: src/ui/interaction/SketchPanel.ts:81
Returns
void
undo()
undo():
void
Defined in: src/ui/interaction/SketchPanel.ts:169
Returns
void
update()
update():
void
Defined in: src/ui/interaction/SketchPanel.ts:213
Runs per frame.
Returns
void
Overrides
updateLayout()
updateLayout():
void
Defined in: src/ui/core/View.ts:153
Calculates and applies the position and scale for this single view based on its layout properties and its parent's dimensions.
Returns
void
Inherited from
updateLayouts()
updateLayouts():
void
Defined in: src/ui/core/View.ts:181
Triggers a layout update for this view and all its descendants.
Returns
void
Inherited from
updateLayoutsBFS()
updateLayoutsBFS():
void
Defined in: src/ui/core/View.ts:189
Performs a Breadth-First Search (BFS) traversal to update the layout tree, ensuring parent layouts are calculated before their children.
Returns
void
Inherited from
dpToMeters()
staticdpToMeters(dp):number
Defined in: src/ui/core/View.ts:119
Converts a value from Density-Independent Pixels (DP) to meters.
Parameters
dp
number
The value in density-independent pixels.
Returns
number
The equivalent value in meters.