import { type Nullable } from "@babylonjs/core/types.js"; import { Observable } from "@babylonjs/core/Misc/observable.js"; import { Vector2, Vector3 } from "@babylonjs/core/Maths/math.vector.pure.js"; import { type PointerInfoBase } from "@babylonjs/core/Events/pointerEvents.js"; import { type TransformNode } from "@babylonjs/core/Meshes/transformNode.js"; import { type Scene } from "@babylonjs/core/scene.js"; import { type Container } from "./container.pure.js"; import { type AdvancedDynamicTexture } from "../advancedDynamicTexture.js"; import { ValueAndUnit } from "../valueAndUnit.js"; import { Measure } from "../measure.js"; import { type Style } from "../style.js"; import { Matrix2D, Vector2WithInfo } from "../math2D.js"; import { type ICanvasGradient, type ICanvasRenderingContext } from "@babylonjs/core/Engines/ICanvas.js"; import { type IAccessibilityTag } from "@babylonjs/core/IAccessibilityTag.js"; import { type IKeyboardEvent } from "@babylonjs/core/Events/deviceInputEvents.js"; import { type IAnimatable } from "@babylonjs/core/Animations/animatable.interface.js"; import { type Animation } from "@babylonjs/core/Animations/animation.js"; import { type BaseGradient } from "./gradient/BaseGradient.js"; import { type AbstractEngine } from "@babylonjs/core/Engines/abstractEngine.js"; import { type IFocusableControl } from "./focusableControl.js"; /** * Root class used for all 2D controls * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#controls */ export declare class Control implements IAnimatable, IFocusableControl { /** defines the name of the control */ name?: string | undefined; /** * Gets or sets a boolean indicating if alpha must be an inherited value (false by default) */ static AllowAlphaInheritance: boolean; private _alpha; private _alphaSet; private _zIndex; /** @internal */ _host: AdvancedDynamicTexture; /** Gets or sets the control parent */ parent: Nullable; /** @internal */ _currentMeasure: Measure; /** @internal */ _tempPaddingMeasure: Measure; private _fontFamily; private _fontStyle; private _fontWeight; private static readonly _DefaultFontSize; private _fontSize; private _font; /** @internal */ _width: ValueAndUnit; /** @internal */ _height: ValueAndUnit; /** @internal */ protected _fontOffset: { ascent: number; height: number; descent: number; }; private _color; private _style; private _styleObserver; /** @internal */ protected _horizontalAlignment: number; /** @internal */ protected _verticalAlignment: number; /** @internal */ protected _isDirty: boolean; /** @internal */ protected _wasDirty: boolean; /** @internal */ _tempParentMeasure: Measure; /** @internal */ _prevCurrentMeasureTransformedIntoGlobalSpace: Measure; /** @internal */ _cachedParentMeasure: Measure; private _descendantsOnlyPadding; private _paddingLeft; private _paddingRight; private _paddingTop; private _paddingBottom; /** @internal */ _left: ValueAndUnit; /** @internal */ _top: ValueAndUnit; private _scaleX; private _scaleY; private _rotation; private _transformCenterX; private _transformCenterY; /** @internal */ _transformMatrix: Matrix2D; /** @internal */ protected _invertTransformMatrix: Matrix2D; /** @internal */ protected _transformedPosition: Vector2; private _isMatrixDirty; private _cachedOffsetX; private _cachedOffsetY; private _isVisible; private _isHighlighted; private _highlightColor; protected _highlightLineWidth: number; /** @internal */ _linkedMesh: Nullable; private _fontSet; private _dummyVector2; private _downCount; private _enterCount; private _doNotRender; private _downPointerIds; private _evaluatedMeasure; private _evaluatedParentMeasure; protected _isEnabled: boolean; protected _disabledColor: string; protected _disabledColorItem: string; protected _isReadOnly: boolean; private _gradient; /** @internal */ protected _rebuildLayout: boolean; /** @internal */ protected _urlRewriter?: (url: string) => string; /** * Observable that fires when the control's enabled state changes */ onEnabledStateChangedObservable: Observable; /** @internal */ _customData: any; /** @internal */ _isClipped: boolean; /** @internal */ _automaticSize: boolean; /** @internal */ _tag: any; /** * Gets or sets the unique id of the node. Please note that this number will be updated when the control is added to a container */ uniqueId: number; /** * Gets or sets a boolean indicating if the control is readonly (default: false). * A readonly control will still raise pointer events but will not react to them */ get isReadOnly(): boolean; set isReadOnly(value: boolean); /** * Gets the transformed measure, that is the bounding box of the control after applying all transformations */ get transformedMeasure(): Measure; /** * Gets or sets an object used to store user defined information for the node */ metadata: any; /** Gets or sets a boolean indicating if the control can be hit with pointer events */ isHitTestVisible: boolean; /** Gets or sets a boolean indicating if the control can block pointer events. False by default except on the following controls: * * Button controls (Button, RadioButton, ToggleButton) * * Checkbox * * ColorPicker * * InputText * * Slider */ isPointerBlocker: boolean; /** Gets or sets a boolean indicating if the control can be focusable */ isFocusInvisible: boolean; protected _clipChildren: boolean; /** * Sets/Gets a boolean indicating if the children are clipped to the current control bounds. * Please note that not clipping children may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children */ set clipChildren(value: boolean); get clipChildren(): boolean; protected _clipContent: boolean; /** * Sets/Gets a boolean indicating that control content must be clipped * Please note that not clipping content may generate issues with adt.useInvalidateRectOptimization so it is recommended to turn this optimization off if you want to use unclipped children */ set clipContent(value: boolean); get clipContent(): boolean; /** * Gets or sets a boolean indicating that the current control should cache its rendering (useful when the control does not change often) */ useBitmapCache: boolean; private _cacheData; private _shadowOffsetX; /** Gets or sets a value indicating the offset in pixels to apply on X axis to render the shadow */ get shadowOffsetX(): number; set shadowOffsetX(value: number); private _shadowOffsetY; /** Gets or sets a value indicating the offset in pixels to apply on Y axis to render the shadow */ get shadowOffsetY(): number; set shadowOffsetY(value: number); private _shadowBlur; private _previousShadowBlur; /** Gets or sets a value indicating the amount of blur to use to render the shadow */ get shadowBlur(): number; set shadowBlur(value: number); private _shadowColor; /** Gets or sets a value indicating the color of the shadow (black by default ie. "#000") */ get shadowColor(): string; set shadowColor(value: string); /** Gets or sets the cursor to use when the control is hovered */ hoverCursor: string; /** @internal */ protected _linkOffsetX: ValueAndUnit; /** @internal */ protected _linkOffsetY: ValueAndUnit; /** Gets the control type name */ get typeName(): string; /** * Get the current class name of the control. * @returns current class name */ getClassName(): string; /** * Gets or sets the accessibility tag to describe the control for accessibility purpose. * By default, GUI controls already indicate accessibility info, but one can override the info using this tag. */ set accessibilityTag(value: Nullable); get accessibilityTag(): Nullable; protected _accessibilityTag: Nullable; /** * Observable that fires whenever the accessibility event of the control has changed */ onAccessibilityTagChangedObservable: Observable>; /** * An event triggered when pointer wheel is scrolled */ onWheelObservable: Observable; /** * An event triggered when the pointer moves over the control. */ onPointerMoveObservable: Observable; /** * An event triggered when the pointer moves out of the control. */ onPointerOutObservable: Observable; /** * An event triggered when the pointer taps the control */ onPointerDownObservable: Observable; /** * An event triggered when pointer up */ onPointerUpObservable: Observable; /** * An event triggered when a control is clicked on */ onPointerClickObservable: Observable; /** * An event triggered when a control receives an ENTER key down event */ onEnterPressedObservable: Observable; /** * An event triggered when pointer enters the control */ onPointerEnterObservable: Observable; /** * An event triggered when the control is marked as dirty */ onDirtyObservable: Observable; /** * An event triggered before drawing the control */ onBeforeDrawObservable: Observable; /** * An event triggered after the control was drawn */ onAfterDrawObservable: Observable; /** * An event triggered when the control has been disposed */ onDisposeObservable: Observable; /** * An event triggered when the control isVisible is changed */ onIsVisibleChangedObservable: Observable; /** * Get the hosting AdvancedDynamicTexture */ get host(): AdvancedDynamicTexture; /** Gets or set information about font offsets (used to render and align text) */ get fontOffset(): { ascent: number; height: number; descent: number; }; set fontOffset(offset: { ascent: number; height: number; descent: number; }); /** Gets or sets alpha value for the control (1 means opaque and 0 means entirely transparent) */ get alpha(): number; set alpha(value: number); /** * Gets or sets a number indicating size of stroke we want to highlight the control with (mostly for debugging purpose) */ get highlightLineWidth(): number; set highlightLineWidth(value: number); /** * Gets or sets a boolean indicating that we want to highlight the control (mostly for debugging purpose) */ get isHighlighted(): boolean; set isHighlighted(value: boolean); /** * Indicates if the control should be serialized. Defaults to true. */ isSerializable: boolean; /** * Gets or sets a string defining the color to use for highlighting this control */ get highlightColor(): string; set highlightColor(value: string); /** Gets or sets a value indicating the scale factor on X axis (1 by default) * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#rotation-and-scaling */ get scaleX(): number; set scaleX(value: number); /** Gets or sets a value indicating the scale factor on Y axis (1 by default) * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#rotation-and-scaling */ get scaleY(): number; set scaleY(value: number); /** Gets or sets the rotation angle (0 by default) * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#rotation-and-scaling */ get rotation(): number; set rotation(value: number); /** Gets or sets the transformation center on Y axis (0 by default) * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#rotation-and-scaling */ get transformCenterY(): number; set transformCenterY(value: number); /** Gets or sets the transformation center on X axis (0 by default) * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#rotation-and-scaling */ get transformCenterX(): number; set transformCenterX(value: number); /** * Gets or sets the horizontal alignment * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#alignments */ get horizontalAlignment(): number; set horizontalAlignment(value: number); /** * Gets or sets the vertical alignment * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#alignments */ get verticalAlignment(): number; set verticalAlignment(value: number); private _fixedRatio; set fixedRatio(value: number); /** * Gets or sets a fixed ratio for this control. * When different from 0, the ratio is used to compute the "second" dimension. * The first dimension used in the computation is the last one set (by setting width / widthInPixels or height / heightInPixels), and the * second dimension is computed as first dimension * fixedRatio */ get fixedRatio(): number; private _fixedRatioMasterIsWidth; set fixedRatioMasterIsWidth(value: boolean); /** * Gets or sets a boolean indicating that the fixed ratio is set on the width instead of the height. True by default. * When the height of a control is set, this property is changed to false. */ get fixedRatioMasterIsWidth(): boolean; /** * Gets or sets control width * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#position-and-size */ get width(): string | number; set width(value: string | number); /** * Gets or sets the control width in pixel * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#position-and-size */ get widthInPixels(): number; set widthInPixels(value: number); /** * Gets or sets control height * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#position-and-size */ get height(): string | number; set height(value: string | number); /** * Gets or sets control height in pixel * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#position-and-size */ get heightInPixels(): number; set heightInPixels(value: number); /** Gets or set font family */ get fontFamily(): string; set fontFamily(value: string); /** Gets or sets font style */ get fontStyle(): string; set fontStyle(value: string); /** Gets or sets font weight */ get fontWeight(): string; set fontWeight(value: string); /** * Gets or sets style * @see https://doc.babylonjs.com/features/featuresDeepDive/gui/gui#styles */ get style(): Nullable