babylon.gui.module.d.ts 41 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144
  1. declare module 'babylonjs-gui' {
  2. export = BABYLON.GUI;
  3. }
  4. declare module BABYLON.GUI {
  5. /**
  6. * Define a style used by control to automatically setup properties based on a template.
  7. * Only support font related properties so far
  8. */
  9. class Style implements BABYLON.IDisposable {
  10. private _fontFamily;
  11. private _fontStyle;
  12. /** @hidden */
  13. _host: AdvancedDynamicTexture;
  14. /** @hidden */
  15. _fontSize: ValueAndUnit;
  16. /**
  17. * Observable raised when the style values are changed
  18. */
  19. onChangedObservable: Observable<Style>;
  20. /**
  21. * Creates a new style object
  22. * @param host defines the AdvancedDynamicTexture which hosts this style
  23. */
  24. constructor(host: AdvancedDynamicTexture);
  25. /**
  26. * Gets or sets the font size
  27. */
  28. fontSize: string | number;
  29. /**
  30. * Gets or sets the font family
  31. */
  32. fontFamily: string;
  33. /**
  34. * Gets or sets the font style
  35. */
  36. fontStyle: string;
  37. /** Dispose all associated resources */
  38. dispose(): void;
  39. }
  40. }
  41. declare module BABYLON.GUI {
  42. class ValueAndUnit {
  43. unit: number;
  44. negativeValueAllowed: boolean;
  45. private _value;
  46. ignoreAdaptiveScaling: boolean;
  47. constructor(value: number, unit?: number, negativeValueAllowed?: boolean);
  48. readonly isPercentage: boolean;
  49. readonly isPixel: boolean;
  50. readonly internalValue: number;
  51. getValueInPixel(host: AdvancedDynamicTexture, refValue: number): number;
  52. getValue(host: AdvancedDynamicTexture): number;
  53. toString(host: AdvancedDynamicTexture): string;
  54. fromString(source: string | number): boolean;
  55. private static _Regex;
  56. private static _UNITMODE_PERCENTAGE;
  57. private static _UNITMODE_PIXEL;
  58. static readonly UNITMODE_PERCENTAGE: number;
  59. static readonly UNITMODE_PIXEL: number;
  60. }
  61. }
  62. declare module BABYLON.GUI {
  63. interface IFocusableControl {
  64. onFocus(): void;
  65. onBlur(): void;
  66. processKeyboard(evt: KeyboardEvent): void;
  67. }
  68. class AdvancedDynamicTexture extends DynamicTexture {
  69. private _isDirty;
  70. private _renderObserver;
  71. private _resizeObserver;
  72. private _preKeyboardObserver;
  73. private _pointerMoveObserver;
  74. private _pointerObserver;
  75. private _canvasPointerOutObserver;
  76. private _background;
  77. _rootContainer: Container;
  78. _lastPickedControl: Control;
  79. _lastControlOver: {
  80. [pointerId: number]: Control;
  81. };
  82. _lastControlDown: {
  83. [pointerId: number]: Control;
  84. };
  85. _capturingControl: {
  86. [pointerId: number]: Control;
  87. };
  88. _shouldBlockPointer: boolean;
  89. _layerToDispose: Nullable<Layer>;
  90. _linkedControls: Control[];
  91. private _isFullscreen;
  92. private _fullscreenViewport;
  93. private _idealWidth;
  94. private _idealHeight;
  95. private _useSmallestIdeal;
  96. private _renderAtIdealSize;
  97. private _focusedControl;
  98. private _blockNextFocusCheck;
  99. private _renderScale;
  100. renderScale: number;
  101. background: string;
  102. idealWidth: number;
  103. idealHeight: number;
  104. useSmallestIdeal: boolean;
  105. renderAtIdealSize: boolean;
  106. readonly layer: Nullable<Layer>;
  107. readonly rootContainer: Container;
  108. focusedControl: Nullable<IFocusableControl>;
  109. isForeground: boolean;
  110. constructor(name: string, width: number | undefined, height: number | undefined, scene: Nullable<Scene>, generateMipMaps?: boolean, samplingMode?: number);
  111. executeOnAllControls(func: (control: Control) => void, container?: Container): void;
  112. markAsDirty(): void;
  113. /**
  114. * Helper function used to create a new style
  115. */
  116. createStyle(): Style;
  117. addControl(control: Control): AdvancedDynamicTexture;
  118. removeControl(control: Control): AdvancedDynamicTexture;
  119. dispose(): void;
  120. private _onResize();
  121. _getGlobalViewport(scene: Scene): Viewport;
  122. getProjectedPosition(position: Vector3, worldMatrix: Matrix): Vector2;
  123. private _checkUpdate(camera);
  124. private _render();
  125. private _doPicking(x, y, type, pointerId, buttonIndex);
  126. _cleanControlAfterRemovalFromList(list: {
  127. [pointerId: number]: Control;
  128. }, control: Control): void;
  129. _cleanControlAfterRemoval(control: Control): void;
  130. attach(): void;
  131. attachToMesh(mesh: AbstractMesh, supportPointerMove?: boolean): void;
  132. moveFocusToControl(control: IFocusableControl): void;
  133. private _manageFocus();
  134. private _attachToOnPointerOut(scene);
  135. static CreateForMesh(mesh: AbstractMesh, width?: number, height?: number, supportPointerMove?: boolean): AdvancedDynamicTexture;
  136. /**
  137. * FullScreenUI is created in a layer. This allows it to be treated like any other layer.
  138. * As such, if you have a multi camera setup, you can set the layerMask on the GUI as well.
  139. * When the GUI is not Created as FullscreenUI it does not respect the layerMask.
  140. * layerMask is set through advancedTexture.layer.layerMask
  141. * @param name name for the Texture
  142. * @param foreground render in foreground (default is true)
  143. * @param scene scene to be rendered in
  144. * @param sampling method for scaling to fit screen
  145. * @returns AdvancedDynamicTexture
  146. */
  147. static CreateFullscreenUI(name: string, foreground?: boolean, scene?: Nullable<Scene>, sampling?: number): AdvancedDynamicTexture;
  148. }
  149. }
  150. declare module BABYLON.GUI {
  151. class Measure {
  152. left: number;
  153. top: number;
  154. width: number;
  155. height: number;
  156. constructor(left: number, top: number, width: number, height: number);
  157. copyFrom(other: Measure): void;
  158. isEqualsTo(other: Measure): boolean;
  159. static Empty(): Measure;
  160. }
  161. }
  162. declare module BABYLON.GUI {
  163. class Vector2WithInfo extends Vector2 {
  164. buttonIndex: number;
  165. constructor(source: Vector2, buttonIndex?: number);
  166. }
  167. class Matrix2D {
  168. m: Float32Array;
  169. constructor(m00: number, m01: number, m10: number, m11: number, m20: number, m21: number);
  170. fromValues(m00: number, m01: number, m10: number, m11: number, m20: number, m21: number): Matrix2D;
  171. determinant(): number;
  172. invertToRef(result: Matrix2D): Matrix2D;
  173. multiplyToRef(other: Matrix2D, result: Matrix2D): Matrix2D;
  174. transformCoordinates(x: number, y: number, result: Vector2): Matrix2D;
  175. static Identity(): Matrix2D;
  176. static TranslationToRef(x: number, y: number, result: Matrix2D): void;
  177. static ScalingToRef(x: number, y: number, result: Matrix2D): void;
  178. static RotationToRef(angle: number, result: Matrix2D): void;
  179. private static _TempPreTranslationMatrix;
  180. private static _TempPostTranslationMatrix;
  181. private static _TempRotationMatrix;
  182. private static _TempScalingMatrix;
  183. private static _TempCompose0;
  184. private static _TempCompose1;
  185. private static _TempCompose2;
  186. static ComposeToRef(tx: number, ty: number, angle: number, scaleX: number, scaleY: number, parentMatrix: Nullable<Matrix2D>, result: Matrix2D): void;
  187. }
  188. }
  189. declare module BABYLON.GUI {
  190. class MultiLinePoint {
  191. private _multiLine;
  192. private _x;
  193. private _y;
  194. private _control;
  195. private _mesh;
  196. private _controlObserver;
  197. private _meshObserver;
  198. _point: Vector2;
  199. constructor(multiLine: MultiLine);
  200. x: string | number;
  201. y: string | number;
  202. control: Nullable<Control>;
  203. mesh: Nullable<AbstractMesh>;
  204. translate(): Vector2;
  205. private _translatePoint();
  206. dispose(): void;
  207. }
  208. }
  209. declare module BABYLON.GUI {
  210. class Control {
  211. name: string | undefined;
  212. private _alpha;
  213. private _alphaSet;
  214. private _zIndex;
  215. _root: Nullable<Container>;
  216. _host: AdvancedDynamicTexture;
  217. parent: Nullable<Container>;
  218. _currentMeasure: Measure;
  219. private _fontFamily;
  220. private _fontStyle;
  221. private _fontSize;
  222. private _font;
  223. _width: ValueAndUnit;
  224. _height: ValueAndUnit;
  225. protected _fontOffset: {
  226. ascent: number;
  227. height: number;
  228. descent: number;
  229. };
  230. private _color;
  231. private _style;
  232. private _styleObserver;
  233. protected _horizontalAlignment: number;
  234. protected _verticalAlignment: number;
  235. private _isDirty;
  236. _tempParentMeasure: Measure;
  237. protected _cachedParentMeasure: Measure;
  238. private _paddingLeft;
  239. private _paddingRight;
  240. private _paddingTop;
  241. private _paddingBottom;
  242. _left: ValueAndUnit;
  243. _top: ValueAndUnit;
  244. private _scaleX;
  245. private _scaleY;
  246. private _rotation;
  247. private _transformCenterX;
  248. private _transformCenterY;
  249. private _transformMatrix;
  250. protected _invertTransformMatrix: Matrix2D;
  251. protected _transformedPosition: Vector2;
  252. private _onlyMeasureMode;
  253. private _isMatrixDirty;
  254. private _cachedOffsetX;
  255. private _cachedOffsetY;
  256. private _isVisible;
  257. _linkedMesh: Nullable<AbstractMesh>;
  258. private _fontSet;
  259. private _dummyVector2;
  260. private _downCount;
  261. private _enterCount;
  262. private _doNotRender;
  263. private _downPointerIds;
  264. isHitTestVisible: boolean;
  265. isPointerBlocker: boolean;
  266. isFocusInvisible: boolean;
  267. shadowOffsetX: number;
  268. shadowOffsetY: number;
  269. shadowBlur: number;
  270. shadowColor: string;
  271. protected _linkOffsetX: ValueAndUnit;
  272. protected _linkOffsetY: ValueAndUnit;
  273. readonly typeName: string;
  274. /**
  275. * An event triggered when the pointer move over the control.
  276. */
  277. onPointerMoveObservable: Observable<Vector2>;
  278. /**
  279. * An event triggered when the pointer move out of the control.
  280. */
  281. onPointerOutObservable: Observable<Control>;
  282. /**
  283. * An event triggered when the pointer taps the control
  284. */
  285. onPointerDownObservable: Observable<Vector2WithInfo>;
  286. /**
  287. * An event triggered when pointer up
  288. */
  289. onPointerUpObservable: Observable<Vector2WithInfo>;
  290. /**
  291. * An event triggered when a control is clicked on
  292. */
  293. onPointerClickObservable: Observable<Vector2WithInfo>;
  294. /**
  295. * An event triggered when pointer enters the control
  296. */
  297. onPointerEnterObservable: Observable<Control>;
  298. /**
  299. * An event triggered when the control is marked as dirty
  300. */
  301. onDirtyObservable: Observable<Control>;
  302. /**
  303. * An event triggered after the control is drawn
  304. */
  305. onAfterDrawObservable: Observable<Control>;
  306. /** Gets or set information about font offsets (used to render and align text) */
  307. fontOffset: {
  308. ascent: number;
  309. height: number;
  310. descent: number;
  311. };
  312. alpha: number;
  313. scaleX: number;
  314. scaleY: number;
  315. rotation: number;
  316. transformCenterY: number;
  317. transformCenterX: number;
  318. horizontalAlignment: number;
  319. verticalAlignment: number;
  320. width: string | number;
  321. readonly widthInPixels: number;
  322. height: string | number;
  323. readonly heightInPixels: number;
  324. fontFamily: string;
  325. fontStyle: string;
  326. style: BABYLON.Nullable<Style>;
  327. /** @hidden */
  328. readonly _isFontSizeInPercentage: boolean;
  329. readonly fontSizeInPixels: number;
  330. fontSize: string | number;
  331. color: string;
  332. zIndex: number;
  333. notRenderable: boolean;
  334. isVisible: boolean;
  335. readonly isDirty: boolean;
  336. paddingLeft: string | number;
  337. readonly paddingLeftInPixels: number;
  338. paddingRight: string | number;
  339. readonly paddingRightInPixels: number;
  340. paddingTop: string | number;
  341. readonly paddingTopInPixels: number;
  342. paddingBottom: string | number;
  343. readonly paddingBottomInPixels: number;
  344. left: string | number;
  345. readonly leftInPixels: number;
  346. top: string | number;
  347. readonly topInPixels: number;
  348. linkOffsetX: string | number;
  349. readonly linkOffsetXInPixels: number;
  350. linkOffsetY: string | number;
  351. readonly linkOffsetYInPixels: number;
  352. readonly centerX: number;
  353. readonly centerY: number;
  354. constructor(name?: string | undefined);
  355. protected _getTypeName(): string;
  356. /** @hidden */
  357. _resetFontCache(): void;
  358. getLocalCoordinates(globalCoordinates: Vector2): Vector2;
  359. getLocalCoordinatesToRef(globalCoordinates: Vector2, result: Vector2): Control;
  360. getParentLocalCoordinates(globalCoordinates: Vector2): Vector2;
  361. moveToVector3(position: Vector3, scene: Scene): void;
  362. linkWithMesh(mesh: Nullable<AbstractMesh>): void;
  363. _moveToProjectedPosition(projectedPosition: Vector3): void;
  364. _markMatrixAsDirty(): void;
  365. _markAsDirty(): void;
  366. _markAllAsDirty(): void;
  367. _link(root: Nullable<Container>, host: AdvancedDynamicTexture): void;
  368. protected _transform(context: CanvasRenderingContext2D): void;
  369. protected _applyStates(context: CanvasRenderingContext2D): void;
  370. protected _processMeasures(parentMeasure: Measure, context: CanvasRenderingContext2D): boolean;
  371. protected _clip(context: CanvasRenderingContext2D): void;
  372. _measure(): void;
  373. protected _computeAlignment(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  374. protected _preMeasure(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  375. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  376. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  377. contains(x: number, y: number): boolean;
  378. _processPicking(x: number, y: number, type: number, pointerId: number, buttonIndex: number): boolean;
  379. _onPointerMove(target: Control, coordinates: Vector2): void;
  380. _onPointerEnter(target: Control): boolean;
  381. _onPointerOut(target: Control): void;
  382. _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number): boolean;
  383. _onPointerUp(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number, notifyClick: boolean): void;
  384. forcePointerUp(pointerId?: Nullable<number>): void;
  385. _processObservables(type: number, x: number, y: number, pointerId: number, buttonIndex: number): boolean;
  386. private _prepareFont();
  387. dispose(): void;
  388. private static _HORIZONTAL_ALIGNMENT_LEFT;
  389. private static _HORIZONTAL_ALIGNMENT_RIGHT;
  390. private static _HORIZONTAL_ALIGNMENT_CENTER;
  391. private static _VERTICAL_ALIGNMENT_TOP;
  392. private static _VERTICAL_ALIGNMENT_BOTTOM;
  393. private static _VERTICAL_ALIGNMENT_CENTER;
  394. static readonly HORIZONTAL_ALIGNMENT_LEFT: number;
  395. static readonly HORIZONTAL_ALIGNMENT_RIGHT: number;
  396. static readonly HORIZONTAL_ALIGNMENT_CENTER: number;
  397. static readonly VERTICAL_ALIGNMENT_TOP: number;
  398. static readonly VERTICAL_ALIGNMENT_BOTTOM: number;
  399. static readonly VERTICAL_ALIGNMENT_CENTER: number;
  400. private static _FontHeightSizes;
  401. static _GetFontOffset(font: string): {
  402. ascent: number;
  403. height: number;
  404. descent: number;
  405. };
  406. static AddHeader(control: Control, text: string, size: string | number, options: {
  407. isHorizontal: boolean;
  408. controlFirst: boolean;
  409. }): StackPanel;
  410. protected static drawEllipse(x: number, y: number, width: number, height: number, context: CanvasRenderingContext2D): void;
  411. }
  412. }
  413. declare module BABYLON.GUI {
  414. class Container extends Control {
  415. name: string | undefined;
  416. protected _children: Control[];
  417. protected _measureForChildren: Measure;
  418. protected _background: string;
  419. protected _adaptWidthToChildren: boolean;
  420. protected _adaptHeightToChildren: boolean;
  421. adaptHeightToChildren: boolean;
  422. adaptWidthToChildren: boolean;
  423. background: string;
  424. readonly children: Control[];
  425. constructor(name?: string | undefined);
  426. protected _getTypeName(): string;
  427. getChildByName(name: string): Nullable<Control>;
  428. getChildByType(name: string, type: string): Nullable<Control>;
  429. containsControl(control: Control): boolean;
  430. addControl(control: Control): Container;
  431. removeControl(control: Control): Container;
  432. _reOrderControl(control: Control): void;
  433. _markMatrixAsDirty(): void;
  434. _markAllAsDirty(): void;
  435. protected _localDraw(context: CanvasRenderingContext2D): void;
  436. _link(root: Nullable<Container>, host: AdvancedDynamicTexture): void;
  437. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  438. _processPicking(x: number, y: number, type: number, pointerId: number, buttonIndex: number): boolean;
  439. protected _clipForChildren(context: CanvasRenderingContext2D): void;
  440. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  441. dispose(): void;
  442. }
  443. }
  444. declare module BABYLON.GUI {
  445. class StackPanel extends Container {
  446. name: string | undefined;
  447. private _isVertical;
  448. private _manualWidth;
  449. private _manualHeight;
  450. private _doNotTrackManualChanges;
  451. private _tempMeasureStore;
  452. isVertical: boolean;
  453. width: string | number;
  454. height: string | number;
  455. constructor(name?: string | undefined);
  456. protected _getTypeName(): string;
  457. protected _preMeasure(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  458. }
  459. }
  460. declare module BABYLON.GUI {
  461. class Rectangle extends Container {
  462. name: string | undefined;
  463. private _thickness;
  464. private _cornerRadius;
  465. thickness: number;
  466. cornerRadius: number;
  467. constructor(name?: string | undefined);
  468. protected _getTypeName(): string;
  469. protected _localDraw(context: CanvasRenderingContext2D): void;
  470. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  471. private _drawRoundedRect(context, offset?);
  472. protected _clipForChildren(context: CanvasRenderingContext2D): void;
  473. }
  474. }
  475. declare module BABYLON.GUI {
  476. class Ellipse extends Container {
  477. name: string | undefined;
  478. private _thickness;
  479. thickness: number;
  480. constructor(name?: string | undefined);
  481. protected _getTypeName(): string;
  482. protected _localDraw(context: CanvasRenderingContext2D): void;
  483. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  484. protected _clipForChildren(context: CanvasRenderingContext2D): void;
  485. }
  486. }
  487. declare module BABYLON.GUI {
  488. class Line extends Control {
  489. name: string | undefined;
  490. private _lineWidth;
  491. private _x1;
  492. private _y1;
  493. private _x2;
  494. private _y2;
  495. private _dash;
  496. private _connectedControl;
  497. private _connectedControlDirtyObserver;
  498. dash: Array<number>;
  499. connectedControl: Control;
  500. x1: string | number;
  501. y1: string | number;
  502. x2: string | number;
  503. y2: string | number;
  504. lineWidth: number;
  505. horizontalAlignment: number;
  506. verticalAlignment: number;
  507. private readonly _effectiveX2;
  508. private readonly _effectiveY2;
  509. constructor(name?: string | undefined);
  510. protected _getTypeName(): string;
  511. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  512. _measure(): void;
  513. protected _computeAlignment(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  514. /**
  515. * Move one end of the line given 3D cartesian coordinates.
  516. * @param position Targeted world position
  517. * @param scene Scene
  518. * @param end (opt) Set to true to assign x2 and y2 coordinates of the line. Default assign to x1 and y1.
  519. */
  520. moveToVector3(position: Vector3, scene: Scene, end?: boolean): void;
  521. /**
  522. * Move one end of the line to a position in screen absolute space.
  523. * @param projectedPosition Position in screen absolute space (X, Y)
  524. * @param end (opt) Set to true to assign x2 and y2 coordinates of the line. Default assign to x1 and y1.
  525. */
  526. _moveToProjectedPosition(projectedPosition: Vector3, end?: boolean): void;
  527. }
  528. }
  529. declare module BABYLON.GUI {
  530. class Slider extends Control {
  531. name: string | undefined;
  532. private _thumbWidth;
  533. private _minimum;
  534. private _maximum;
  535. private _value;
  536. private _background;
  537. private _borderColor;
  538. private _barOffset;
  539. private _isThumbCircle;
  540. private _isThumbClamped;
  541. onValueChangedObservable: Observable<number>;
  542. borderColor: string;
  543. background: string;
  544. barOffset: string | number;
  545. readonly barOffsetInPixels: number;
  546. thumbWidth: string | number;
  547. readonly thumbWidthInPixels: number;
  548. minimum: number;
  549. maximum: number;
  550. value: number;
  551. isThumbCircle: boolean;
  552. isThumbClamped: boolean;
  553. constructor(name?: string | undefined);
  554. protected _getTypeName(): string;
  555. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  556. private _pointerIsDown;
  557. private _updateValueFromPointer(x, y);
  558. _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number): boolean;
  559. _onPointerMove(target: Control, coordinates: Vector2): void;
  560. _onPointerUp(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number, notifyClick: boolean): void;
  561. }
  562. }
  563. declare module BABYLON.GUI {
  564. class Checkbox extends Control {
  565. name: string | undefined;
  566. private _isChecked;
  567. private _background;
  568. private _checkSizeRatio;
  569. private _thickness;
  570. thickness: number;
  571. onIsCheckedChangedObservable: Observable<boolean>;
  572. checkSizeRatio: number;
  573. background: string;
  574. isChecked: boolean;
  575. constructor(name?: string | undefined);
  576. protected _getTypeName(): string;
  577. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  578. _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number): boolean;
  579. }
  580. }
  581. declare module BABYLON.GUI {
  582. class RadioButton extends Control {
  583. name: string | undefined;
  584. private _isChecked;
  585. private _background;
  586. private _checkSizeRatio;
  587. private _thickness;
  588. thickness: number;
  589. group: string;
  590. onIsCheckedChangedObservable: Observable<boolean>;
  591. checkSizeRatio: number;
  592. background: string;
  593. isChecked: boolean;
  594. constructor(name?: string | undefined);
  595. protected _getTypeName(): string;
  596. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  597. _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number): boolean;
  598. }
  599. }
  600. declare module BABYLON.GUI {
  601. class TextBlock extends Control {
  602. /**
  603. * Defines the name of the control
  604. */
  605. name: string | undefined;
  606. private _text;
  607. private _textWrapping;
  608. private _textHorizontalAlignment;
  609. private _textVerticalAlignment;
  610. private _lines;
  611. private _resizeToFit;
  612. private _lineSpacing;
  613. private _outlineWidth;
  614. private _outlineColor;
  615. /**
  616. * An event triggered after the text is changed
  617. */
  618. onTextChangedObservable: Observable<TextBlock>;
  619. /**
  620. * An event triggered after the text was broken up into lines
  621. */
  622. onLinesReadyObservable: Observable<TextBlock>;
  623. /**
  624. * Return the line list (you may need to use the onLinesReadyObservable to make sure the list is ready)
  625. */
  626. readonly lines: any[];
  627. /**
  628. * Gets or sets an boolean indicating that the TextBlock will be resized to fit container
  629. */
  630. /**
  631. * Gets or sets an boolean indicating that the TextBlock will be resized to fit container
  632. */
  633. resizeToFit: boolean;
  634. /**
  635. * Gets or sets a boolean indicating if text must be wrapped
  636. */
  637. /**
  638. * Gets or sets a boolean indicating if text must be wrapped
  639. */
  640. textWrapping: boolean;
  641. /**
  642. * Gets or sets text to display
  643. */
  644. /**
  645. * Gets or sets text to display
  646. */
  647. text: string;
  648. /**
  649. * Gets or sets text horizontal alignment (BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_CENTER by default)
  650. */
  651. /**
  652. * Gets or sets text horizontal alignment (BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_CENTER by default)
  653. */
  654. textHorizontalAlignment: number;
  655. /**
  656. * Gets or sets text vertical alignment (BABYLON.GUI.Control.VERTICAL_ALIGNMENT_CENTER by default)
  657. */
  658. /**
  659. * Gets or sets text vertical alignment (BABYLON.GUI.Control.VERTICAL_ALIGNMENT_CENTER by default)
  660. */
  661. textVerticalAlignment: number;
  662. /**
  663. * Gets or sets line spacing value
  664. */
  665. /**
  666. * Gets or sets line spacing value
  667. */
  668. lineSpacing: string | number;
  669. /**
  670. * Gets or sets outlineWidth of the text to display
  671. */
  672. /**
  673. * Gets or sets outlineWidth of the text to display
  674. */
  675. outlineWidth: number;
  676. /**
  677. * Gets or sets outlineColor of the text to display
  678. */
  679. /**
  680. * Gets or sets outlineColor of the text to display
  681. */
  682. outlineColor: string;
  683. /**
  684. * Creates a new TextBlock object
  685. * @param name defines the name of the control
  686. * @param text defines the text to display (emptry string by default)
  687. */
  688. constructor(
  689. /**
  690. * Defines the name of the control
  691. */
  692. name?: string | undefined, text?: string);
  693. protected _getTypeName(): string;
  694. private _drawText(text, textWidth, y, context);
  695. /** @hidden */
  696. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  697. protected _applyStates(context: CanvasRenderingContext2D): void;
  698. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  699. protected _parseLine(line: string | undefined, context: CanvasRenderingContext2D): object;
  700. protected _parseLineWithTextWrapping(line: string | undefined, context: CanvasRenderingContext2D): object;
  701. protected _renderLines(context: CanvasRenderingContext2D): void;
  702. dispose(): void;
  703. }
  704. }
  705. declare var DOMImage: new (width?: number | undefined, height?: number | undefined) => HTMLImageElement;
  706. declare module BABYLON.GUI {
  707. class Image extends Control {
  708. name: string | undefined;
  709. private _domImage;
  710. private _imageWidth;
  711. private _imageHeight;
  712. private _loaded;
  713. private _stretch;
  714. private _source;
  715. private _autoScale;
  716. private _sourceLeft;
  717. private _sourceTop;
  718. private _sourceWidth;
  719. private _sourceHeight;
  720. private _cellWidth;
  721. private _cellHeight;
  722. private _cellId;
  723. sourceLeft: number;
  724. sourceTop: number;
  725. sourceWidth: number;
  726. sourceHeight: number;
  727. autoScale: boolean;
  728. stretch: number;
  729. domImage: HTMLImageElement;
  730. private _onImageLoaded();
  731. source: Nullable<string>;
  732. cellWidth: number;
  733. cellHeight: number;
  734. cellId: number;
  735. constructor(name?: string | undefined, url?: Nullable<string>);
  736. protected _getTypeName(): string;
  737. synchronizeSizeWithContent(): void;
  738. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  739. private static _STRETCH_NONE;
  740. private static _STRETCH_FILL;
  741. private static _STRETCH_UNIFORM;
  742. private static _STRETCH_EXTEND;
  743. static readonly STRETCH_NONE: number;
  744. static readonly STRETCH_FILL: number;
  745. static readonly STRETCH_UNIFORM: number;
  746. static readonly STRETCH_EXTEND: number;
  747. }
  748. }
  749. declare module BABYLON.GUI {
  750. class Button extends Rectangle {
  751. name: string | undefined;
  752. pointerEnterAnimation: () => void;
  753. pointerOutAnimation: () => void;
  754. pointerDownAnimation: () => void;
  755. pointerUpAnimation: () => void;
  756. constructor(name?: string | undefined);
  757. protected _getTypeName(): string;
  758. _processPicking(x: number, y: number, type: number, pointerId: number, buttonIndex: number): boolean;
  759. _onPointerEnter(target: Control): boolean;
  760. _onPointerOut(target: Control): void;
  761. _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number): boolean;
  762. _onPointerUp(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number, notifyClick: boolean): void;
  763. static CreateImageButton(name: string, text: string, imageUrl: string): Button;
  764. static CreateImageOnlyButton(name: string, imageUrl: string): Button;
  765. static CreateSimpleButton(name: string, text: string): Button;
  766. static CreateImageWithCenterTextButton(name: string, text: string, imageUrl: string): Button;
  767. }
  768. }
  769. declare module BABYLON.GUI {
  770. class ColorPicker extends Control {
  771. name: string | undefined;
  772. private _colorWheelCanvas;
  773. private _value;
  774. private _tmpColor;
  775. private _pointerStartedOnSquare;
  776. private _pointerStartedOnWheel;
  777. private _squareLeft;
  778. private _squareTop;
  779. private _squareSize;
  780. private _h;
  781. private _s;
  782. private _v;
  783. onValueChangedObservable: Observable<Color3>;
  784. value: Color3;
  785. width: string | number;
  786. height: string | number;
  787. size: string | number;
  788. constructor(name?: string | undefined);
  789. protected _getTypeName(): string;
  790. private _updateSquareProps();
  791. private _drawGradientSquare(hueValue, left, top, width, height, context);
  792. private _drawCircle(centerX, centerY, radius, context);
  793. private _createColorWheelCanvas(radius, thickness);
  794. private _RGBtoHSV(color, result);
  795. private _HSVtoRGB(hue, saturation, value, result);
  796. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  797. private _pointerIsDown;
  798. private _updateValueFromPointer(x, y);
  799. private _isPointOnSquare(coordinates);
  800. private _isPointOnWheel(coordinates);
  801. _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number): boolean;
  802. _onPointerMove(target: Control, coordinates: Vector2): void;
  803. _onPointerUp(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number, notifyClick: boolean): void;
  804. }
  805. }
  806. declare module BABYLON.GUI {
  807. class InputText extends Control implements IFocusableControl {
  808. name: string | undefined;
  809. private _text;
  810. private _placeholderText;
  811. private _background;
  812. private _focusedBackground;
  813. private _placeholderColor;
  814. private _thickness;
  815. private _margin;
  816. private _autoStretchWidth;
  817. private _maxWidth;
  818. private _isFocused;
  819. private _blinkTimeout;
  820. private _blinkIsEven;
  821. private _cursorOffset;
  822. private _scrollLeft;
  823. private _textWidth;
  824. private _clickedCoordinate;
  825. promptMessage: string;
  826. onTextChangedObservable: Observable<InputText>;
  827. onFocusObservable: Observable<InputText>;
  828. onBlurObservable: Observable<InputText>;
  829. maxWidth: string | number;
  830. readonly maxWidthInPixels: number;
  831. margin: string;
  832. readonly marginInPixels: number;
  833. autoStretchWidth: boolean;
  834. thickness: number;
  835. focusedBackground: string;
  836. background: string;
  837. placeholderColor: string;
  838. placeholderText: string;
  839. text: string;
  840. width: string | number;
  841. constructor(name?: string | undefined, text?: string);
  842. onBlur(): void;
  843. onFocus(): void;
  844. protected _getTypeName(): string;
  845. processKey(keyCode: number, key?: string): void;
  846. processKeyboard(evt: KeyboardEvent): void;
  847. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  848. _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number): boolean;
  849. _onPointerUp(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number, notifyClick: boolean): void;
  850. dispose(): void;
  851. }
  852. }
  853. declare module BABYLON.GUI {
  854. class KeyPropertySet {
  855. width?: string;
  856. height?: string;
  857. paddingLeft?: string;
  858. paddingRight?: string;
  859. paddingTop?: string;
  860. paddingBottom?: string;
  861. color?: string;
  862. background?: string;
  863. }
  864. class VirtualKeyboard extends StackPanel {
  865. onKeyPressObservable: Observable<string>;
  866. defaultButtonWidth: string;
  867. defaultButtonHeight: string;
  868. defaultButtonPaddingLeft: string;
  869. defaultButtonPaddingRight: string;
  870. defaultButtonPaddingTop: string;
  871. defaultButtonPaddingBottom: string;
  872. defaultButtonColor: string;
  873. defaultButtonBackground: string;
  874. shiftButtonColor: string;
  875. selectedShiftThickness: number;
  876. shiftState: number;
  877. protected _getTypeName(): string;
  878. private _createKey(key, propertySet);
  879. addKeysRow(keys: Array<string>, propertySets?: Array<KeyPropertySet>): void;
  880. applyShiftState(shiftState: number): void;
  881. private _connectedInputText;
  882. private _onFocusObserver;
  883. private _onBlurObserver;
  884. private _onKeyPressObserver;
  885. readonly connectedInputText: Nullable<InputText>;
  886. connect(input: InputText): void;
  887. disconnect(): void;
  888. static CreateDefaultLayout(): VirtualKeyboard;
  889. }
  890. }
  891. declare module BABYLON.GUI {
  892. class MultiLine extends Control {
  893. name: string | undefined;
  894. private _lineWidth;
  895. private _dash;
  896. private _points;
  897. private _minX;
  898. private _minY;
  899. private _maxX;
  900. private _maxY;
  901. constructor(name?: string | undefined);
  902. dash: Array<number>;
  903. getAt(index: number): MultiLinePoint;
  904. onPointUpdate: () => void;
  905. add(...items: (AbstractMesh | Control | {
  906. x: string | number;
  907. y: string | number;
  908. })[]): MultiLinePoint[];
  909. push(item?: (AbstractMesh | Control | {
  910. x: string | number;
  911. y: string | number;
  912. })): MultiLinePoint;
  913. remove(value: number | MultiLinePoint): void;
  914. lineWidth: number;
  915. horizontalAlignment: number;
  916. verticalAlignment: number;
  917. protected _getTypeName(): string;
  918. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  919. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  920. _measure(): void;
  921. protected _computeAlignment(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  922. dispose(): void;
  923. }
  924. }
  925. declare module BABYLON.GUI {
  926. /**
  927. * Class used to manage 3D user interface
  928. */
  929. class GUI3DManager implements BABYLON.IDisposable {
  930. private _scene;
  931. private _sceneDisposeObserver;
  932. private _utilityLayer;
  933. private _rootContainer;
  934. /** Gets the hosting scene */
  935. readonly scene: Scene;
  936. readonly utilityLayer: Nullable<UtilityLayerRenderer>;
  937. /**
  938. * Creates a new GUI3DManager
  939. * @param scene
  940. */
  941. constructor(scene?: Scene);
  942. /**
  943. * Gets the root container
  944. */
  945. readonly rootContainer: Container3D;
  946. /**
  947. * Gets a boolean indicating if the given control is in the root child list
  948. * @param control defines the control to check
  949. * @returns true if the control is in the root child list
  950. */
  951. containsControl(control: Control3D): boolean;
  952. /**
  953. * Adds a control to the root child list
  954. * @param control defines the control to add
  955. * @returns the current manager
  956. */
  957. addControl(control: Control3D): GUI3DManager;
  958. /**
  959. * Removes the control from the root child list
  960. * @param control defines the control to remove
  961. * @returns the current container
  962. */
  963. removeControl(control: Control3D): GUI3DManager;
  964. /**
  965. * Releases all associated resources
  966. */
  967. dispose(): void;
  968. }
  969. }
  970. declare module BABYLON.GUI {
  971. /**
  972. * Class used as base class for controls
  973. */
  974. class Control3D implements IDisposable, IBehaviorAware<Control3D> {
  975. /** Defines the control name */
  976. name: string | undefined;
  977. /** @hidden */
  978. _host: GUI3DManager;
  979. private _mesh;
  980. /**
  981. * Gets or sets the parent container
  982. */
  983. parent: Nullable<Container3D>;
  984. private _behaviors;
  985. /**
  986. * Gets the list of attached behaviors
  987. * @see http://doc.babylonjs.com/features/behaviour
  988. */
  989. readonly behaviors: Behavior<Control3D>[];
  990. /**
  991. * Attach a behavior to the control
  992. * @see http://doc.babylonjs.com/features/behaviour
  993. * @param behavior defines the behavior to attach
  994. * @returns the current control
  995. */
  996. addBehavior(behavior: Behavior<Control3D>): Control3D;
  997. /**
  998. * Remove an attached behavior
  999. * @see http://doc.babylonjs.com/features/behaviour
  1000. * @param behavior defines the behavior to attach
  1001. * @returns the current control
  1002. */
  1003. removeBehavior(behavior: Behavior<Control3D>): Control3D;
  1004. /**
  1005. * Gets an attached behavior by name
  1006. * @param name defines the name of the behavior to look for
  1007. * @see http://doc.babylonjs.com/features/behaviour
  1008. * @returns null if behavior was not found else the requested behavior
  1009. */
  1010. getBehaviorByName(name: string): Nullable<Behavior<Control3D>>;
  1011. /**
  1012. * Creates a new control
  1013. * @param name defines the control name
  1014. */
  1015. constructor(
  1016. /** Defines the control name */
  1017. name?: string | undefined);
  1018. /**
  1019. * Gets a string representing the class name
  1020. */
  1021. readonly typeName: string;
  1022. protected _getTypeName(): string;
  1023. /**
  1024. * Get the attached mesh used to render the control
  1025. * @param scene defines the scene where the mesh must be attached
  1026. * @returns the attached mesh or null if none
  1027. */
  1028. getAttachedMesh(scene: Scene): Nullable<Mesh>;
  1029. /**
  1030. * Mesh creation.
  1031. * Can be overriden by children
  1032. * @param scene defines the scene where the mesh must be attached
  1033. * @returns the attached mesh or null if none
  1034. */
  1035. protected _createMesh(scene: Scene): Nullable<Mesh>;
  1036. /**
  1037. * Releases all associated resources
  1038. */
  1039. dispose(): void;
  1040. }
  1041. }
  1042. declare module BABYLON.GUI {
  1043. /**
  1044. * Class used to create containers for controls
  1045. */
  1046. class Container3D extends Control3D {
  1047. private _children;
  1048. /**
  1049. * Creates a new container
  1050. * @param name defines the container name
  1051. */
  1052. constructor(name?: string);
  1053. /**
  1054. * Gets a boolean indicating if the given control is in the children of this control
  1055. * @param control defines the control to check
  1056. * @returns true if the control is in the child list
  1057. */
  1058. containsControl(control: Control3D): boolean;
  1059. /**
  1060. * Adds a control to the children of this control
  1061. * @param control defines the control to add
  1062. * @returns the current container
  1063. */
  1064. addControl(control: Control3D): Container3D;
  1065. /**
  1066. * Removes the control from the children of this control
  1067. * @param control defines the control to remove
  1068. * @returns the current container
  1069. */
  1070. removeControl(control: Control3D): Container3D;
  1071. protected _getTypeName(): string;
  1072. /**
  1073. * Releases all associated resources
  1074. */
  1075. dispose(): void;
  1076. }
  1077. }
  1078. declare module BABYLON.GUI {
  1079. /**
  1080. * Class used to create a button in 3D
  1081. */
  1082. class Button3D extends Control3D {
  1083. /**
  1084. * Creates a new button
  1085. * @param name defines the control name
  1086. */
  1087. constructor(name?: string);
  1088. protected _getTypeName(): string;
  1089. protected _createMesh(scene: Scene): Mesh;
  1090. }
  1091. }