babylon.gui.d.ts 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604
  1. declare module BABYLON.GUI {
  2. class AdvancedDynamicTexture extends DynamicTexture {
  3. private _isDirty;
  4. private _renderObserver;
  5. private _resizeObserver;
  6. private _pointerMoveObserver;
  7. private _pointerObserver;
  8. private _canvasBlurObserver;
  9. private _background;
  10. _rootContainer: Container;
  11. _lastControlOver: Control;
  12. _lastControlDown: Control;
  13. _capturingControl: Control;
  14. _shouldBlockPointer: boolean;
  15. _layerToDispose: Layer;
  16. _linkedControls: Control[];
  17. private _isFullscreen;
  18. private _fullscreenViewport;
  19. private _idealWidth;
  20. private _idealHeight;
  21. private _renderAtIdealSize;
  22. background: string;
  23. idealWidth: number;
  24. idealHeight: number;
  25. renderAtIdealSize: boolean;
  26. readonly layer: Layer;
  27. constructor(name: string, width: number, height: number, scene: Scene, generateMipMaps?: boolean, samplingMode?: number);
  28. executeOnAllControls(func: (control: Control) => void, container?: Container): void;
  29. markAsDirty(): void;
  30. addControl(control: Control): AdvancedDynamicTexture;
  31. removeControl(control: Control): AdvancedDynamicTexture;
  32. dispose(): void;
  33. private _onResize();
  34. _getGlobalViewport(scene: Scene): Viewport;
  35. private _checkUpdate(camera);
  36. private _render();
  37. private _doPicking(x, y, type);
  38. attach(): void;
  39. attachToMesh(mesh: AbstractMesh, supportPointerMove?: boolean): void;
  40. private _attachToOnBlur(scene);
  41. static CreateForMesh(mesh: AbstractMesh, width?: number, height?: number, supportPointerMove?: boolean): AdvancedDynamicTexture;
  42. static CreateFullscreenUI(name: string, foreground?: boolean, scene?: Scene): AdvancedDynamicTexture;
  43. }
  44. }
  45. declare module BABYLON.GUI {
  46. class Measure {
  47. left: number;
  48. top: number;
  49. width: number;
  50. height: number;
  51. constructor(left: number, top: number, width: number, height: number);
  52. copyFrom(other: Measure): void;
  53. isEqualsTo(other: Measure): boolean;
  54. static Empty(): Measure;
  55. }
  56. }
  57. declare module BABYLON.GUI {
  58. class Matrix2D {
  59. m: Float32Array;
  60. constructor(m00: number, m01: number, m10: number, m11: number, m20: number, m21: number);
  61. fromValues(m00: number, m01: number, m10: number, m11: number, m20: number, m21: number): Matrix2D;
  62. determinant(): number;
  63. invertToRef(result: Matrix2D): Matrix2D;
  64. multiplyToRef(other: Matrix2D, result: Matrix2D): Matrix2D;
  65. transformCoordinates(x: number, y: number, result: Vector2): Matrix2D;
  66. static Identity(): Matrix2D;
  67. static TranslationToRef(x: number, y: number, result: Matrix2D): void;
  68. static ScalingToRef(x: number, y: number, result: Matrix2D): void;
  69. static RotationToRef(angle: number, result: Matrix2D): void;
  70. private static _TempPreTranslationMatrix;
  71. private static _TempPostTranslationMatrix;
  72. private static _TempRotationMatrix;
  73. private static _TempScalingMatrix;
  74. private static _TempCompose0;
  75. private static _TempCompose1;
  76. private static _TempCompose2;
  77. static ComposeToRef(tx: number, ty: number, angle: number, scaleX: number, scaleY: number, parentMatrix: Matrix2D, result: Matrix2D): void;
  78. }
  79. }
  80. declare module BABYLON.GUI {
  81. class ValueAndUnit {
  82. unit: number;
  83. negativeValueAllowed: boolean;
  84. private _value;
  85. ignoreAdaptiveScaling: boolean;
  86. constructor(value: any, unit?: number, negativeValueAllowed?: boolean);
  87. readonly isPercentage: boolean;
  88. readonly isPixel: boolean;
  89. readonly internalValue: number;
  90. getValueInPixel(host: AdvancedDynamicTexture, refValue: number): number;
  91. getValue(host: AdvancedDynamicTexture): number;
  92. toString(host: AdvancedDynamicTexture): string;
  93. fromString(source: string | number): boolean;
  94. private static _Regex;
  95. private static _UNITMODE_PERCENTAGE;
  96. private static _UNITMODE_PIXEL;
  97. static readonly UNITMODE_PERCENTAGE: number;
  98. static readonly UNITMODE_PIXEL: number;
  99. }
  100. }
  101. declare module BABYLON.GUI {
  102. class Control {
  103. name: string;
  104. private _alpha;
  105. private _alphaSet;
  106. private _zIndex;
  107. _root: Container;
  108. _host: AdvancedDynamicTexture;
  109. _currentMeasure: Measure;
  110. private _fontFamily;
  111. private _fontSize;
  112. private _font;
  113. _width: ValueAndUnit;
  114. _height: ValueAndUnit;
  115. private _lastMeasuredFont;
  116. protected _fontOffset: {
  117. ascent: number;
  118. height: number;
  119. descent: number;
  120. };
  121. private _color;
  122. protected _horizontalAlignment: number;
  123. protected _verticalAlignment: number;
  124. private _isDirty;
  125. private _cachedParentMeasure;
  126. private _paddingLeft;
  127. private _paddingRight;
  128. private _paddingTop;
  129. private _paddingBottom;
  130. _left: ValueAndUnit;
  131. _top: ValueAndUnit;
  132. private _scaleX;
  133. private _scaleY;
  134. private _rotation;
  135. private _transformCenterX;
  136. private _transformCenterY;
  137. private _transformMatrix;
  138. private _invertTransformMatrix;
  139. private _transformedPosition;
  140. private _isMatrixDirty;
  141. private _cachedOffsetX;
  142. private _cachedOffsetY;
  143. private _isVisible;
  144. _linkedMesh: AbstractMesh;
  145. private _fontSet;
  146. private _dummyVector2;
  147. private _downCount;
  148. private _enterCount;
  149. private _doNotRender;
  150. isHitTestVisible: boolean;
  151. isPointerBlocker: boolean;
  152. protected _linkOffsetX: ValueAndUnit;
  153. protected _linkOffsetY: ValueAndUnit;
  154. readonly typeName: string;
  155. /**
  156. * An event triggered when the pointer move over the control.
  157. * @type {BABYLON.Observable}
  158. */
  159. onPointerMoveObservable: Observable<Vector2>;
  160. /**
  161. * An event triggered when the pointer move out of the control.
  162. * @type {BABYLON.Observable}
  163. */
  164. onPointerOutObservable: Observable<Control>;
  165. /**
  166. * An event triggered when the pointer taps the control
  167. * @type {BABYLON.Observable}
  168. */
  169. onPointerDownObservable: Observable<Vector2>;
  170. /**
  171. * An event triggered when pointer up
  172. * @type {BABYLON.Observable}
  173. */
  174. onPointerUpObservable: Observable<Vector2>;
  175. /**
  176. * An event triggered when pointer enters the control
  177. * @type {BABYLON.Observable}
  178. */
  179. onPointerEnterObservable: Observable<Control>;
  180. /**
  181. * An event triggered when the control is marked as dirty
  182. * @type {BABYLON.Observable}
  183. */
  184. onDirtyObservable: Observable<Control>;
  185. alpha: number;
  186. scaleX: number;
  187. scaleY: number;
  188. rotation: number;
  189. transformCenterY: number;
  190. transformCenterX: number;
  191. horizontalAlignment: number;
  192. verticalAlignment: number;
  193. width: string | number;
  194. height: string | number;
  195. fontFamily: string;
  196. fontSize: string | number;
  197. color: string;
  198. zIndex: number;
  199. notRenderable: boolean;
  200. isVisible: boolean;
  201. readonly isDirty: boolean;
  202. paddingLeft: string | number;
  203. paddingRight: string | number;
  204. paddingTop: string | number;
  205. paddingBottom: string | number;
  206. left: string | number;
  207. top: string | number;
  208. linkOffsetX: string | number;
  209. linkOffsetY: string | number;
  210. readonly centerX: number;
  211. readonly centerY: number;
  212. constructor(name?: string);
  213. protected _getTypeName(): string;
  214. getLocalCoordinates(globalCoordinates: Vector2): Vector2;
  215. getLocalCoordinatesToRef(globalCoordinates: Vector2, result: Vector2): Control;
  216. moveToVector3(position: Vector3, scene: Scene): void;
  217. linkWithMesh(mesh: AbstractMesh): void;
  218. _moveToProjectedPosition(projectedPosition: Vector3): void;
  219. _markMatrixAsDirty(): void;
  220. _markAsDirty(): void;
  221. _markAllAsDirty(): void;
  222. _link(root: Container, host: AdvancedDynamicTexture): void;
  223. protected _transform(context: CanvasRenderingContext2D): void;
  224. protected _applyStates(context: CanvasRenderingContext2D): void;
  225. protected _processMeasures(parentMeasure: Measure, context: CanvasRenderingContext2D): boolean;
  226. protected _clip(context: CanvasRenderingContext2D): void;
  227. _measure(): void;
  228. protected _computeAlignment(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  229. protected _preMeasure(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  230. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  231. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  232. contains(x: number, y: number): boolean;
  233. _processPicking(x: number, y: number, type: number): boolean;
  234. protected _onPointerMove(coordinates: Vector2): void;
  235. protected _onPointerEnter(): boolean;
  236. _onPointerOut(): void;
  237. protected _onPointerDown(coordinates: Vector2): boolean;
  238. protected _onPointerUp(coordinates: Vector2): void;
  239. forcePointerUp(): void;
  240. _processObservables(type: number, x: number, y: number): boolean;
  241. private _prepareFont();
  242. private static _HORIZONTAL_ALIGNMENT_LEFT;
  243. private static _HORIZONTAL_ALIGNMENT_RIGHT;
  244. private static _HORIZONTAL_ALIGNMENT_CENTER;
  245. private static _VERTICAL_ALIGNMENT_TOP;
  246. private static _VERTICAL_ALIGNMENT_BOTTOM;
  247. private static _VERTICAL_ALIGNMENT_CENTER;
  248. static readonly HORIZONTAL_ALIGNMENT_LEFT: number;
  249. static readonly HORIZONTAL_ALIGNMENT_RIGHT: number;
  250. static readonly HORIZONTAL_ALIGNMENT_CENTER: number;
  251. static readonly VERTICAL_ALIGNMENT_TOP: number;
  252. static readonly VERTICAL_ALIGNMENT_BOTTOM: number;
  253. static readonly VERTICAL_ALIGNMENT_CENTER: number;
  254. private static _FontHeightSizes;
  255. static _GetFontOffset(font: string): {
  256. ascent: number;
  257. height: number;
  258. descent: number;
  259. };
  260. static AddHeader(control: Control, text: string, size: string | number, options: {
  261. isHorizontal: boolean;
  262. controlFirst: boolean;
  263. }): StackPanel;
  264. protected static drawEllipse(x: number, y: number, width: number, height: number, context: CanvasRenderingContext2D): void;
  265. }
  266. }
  267. declare module BABYLON.GUI {
  268. class Container extends Control {
  269. name: string;
  270. protected _children: Control[];
  271. protected _measureForChildren: Measure;
  272. protected _background: string;
  273. background: string;
  274. readonly children: Control[];
  275. constructor(name?: string);
  276. protected _getTypeName(): string;
  277. getChildByName(name: string): Control;
  278. getChildByType(name: string, type: string): Control;
  279. containsControl(control: Control): boolean;
  280. addControl(control: Control): Container;
  281. removeControl(control: Control): Container;
  282. _reOrderControl(control: Control): void;
  283. _markMatrixAsDirty(): void;
  284. _markAllAsDirty(): void;
  285. protected _localDraw(context: CanvasRenderingContext2D): void;
  286. _link(root: Container, host: AdvancedDynamicTexture): void;
  287. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  288. _processPicking(x: number, y: number, type: number): boolean;
  289. protected _clipForChildren(context: CanvasRenderingContext2D): void;
  290. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  291. }
  292. }
  293. declare module BABYLON.GUI {
  294. class StackPanel extends Container {
  295. name: string;
  296. private _isVertical;
  297. private _tempMeasureStore;
  298. isVertical: boolean;
  299. constructor(name?: string);
  300. protected _getTypeName(): string;
  301. protected _preMeasure(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  302. }
  303. }
  304. declare module BABYLON.GUI {
  305. class Rectangle extends Container {
  306. name: string;
  307. private _thickness;
  308. private _cornerRadius;
  309. thickness: number;
  310. cornerRadius: number;
  311. constructor(name?: string);
  312. protected _getTypeName(): string;
  313. protected _localDraw(context: CanvasRenderingContext2D): void;
  314. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  315. private _drawRoundedRect(context, offset?);
  316. protected _clipForChildren(context: CanvasRenderingContext2D): void;
  317. }
  318. }
  319. declare module BABYLON.GUI {
  320. class Ellipse extends Container {
  321. name: string;
  322. private _thickness;
  323. thickness: number;
  324. constructor(name?: string);
  325. protected _getTypeName(): string;
  326. protected _localDraw(context: CanvasRenderingContext2D): void;
  327. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  328. protected _clipForChildren(context: CanvasRenderingContext2D): void;
  329. }
  330. }
  331. declare var DOMImage: new (width?: number, height?: number) => HTMLImageElement;
  332. declare module BABYLON.GUI {
  333. class Line extends Control {
  334. name: string;
  335. private _lineWidth;
  336. private _background;
  337. private _x1;
  338. private _y1;
  339. private _x2;
  340. private _y2;
  341. private _dash;
  342. private _connectedControl;
  343. private _connectedControlDirtyObserver;
  344. dash: Array<number>;
  345. connectedControl: Control;
  346. x1: string | number;
  347. y1: string | number;
  348. x2: string | number;
  349. y2: string | number;
  350. lineWidth: number;
  351. horizontalAlignment: number;
  352. verticalAlignment: number;
  353. private readonly _effectiveX2;
  354. private readonly _effectiveY2;
  355. constructor(name?: string);
  356. protected _getTypeName(): string;
  357. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  358. _measure(): void;
  359. protected _computeAlignment(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  360. _moveToProjectedPosition(projectedPosition: Vector3): void;
  361. }
  362. }
  363. declare var DOMImage: new (width?: number, height?: number) => HTMLImageElement;
  364. declare module BABYLON.GUI {
  365. class Slider extends Control {
  366. name: string;
  367. private _thumbWidth;
  368. private _minimum;
  369. private _maximum;
  370. private _value;
  371. private _background;
  372. private _borderColor;
  373. private _barOffset;
  374. onValueChangedObservable: Observable<number>;
  375. borderColor: string;
  376. background: string;
  377. barOffset: string | number;
  378. thumbWidth: string | number;
  379. minimum: number;
  380. maximum: number;
  381. value: number;
  382. constructor(name?: string);
  383. protected _getTypeName(): string;
  384. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  385. private _pointerIsDown;
  386. private _updateValueFromPointer(x);
  387. protected _onPointerDown(coordinates: Vector2): boolean;
  388. protected _onPointerMove(coordinates: Vector2): void;
  389. protected _onPointerUp(coordinates: Vector2): void;
  390. }
  391. }
  392. declare var DOMImage: new (width?: number, height?: number) => HTMLImageElement;
  393. declare module BABYLON.GUI {
  394. class Checkbox extends Control {
  395. name: string;
  396. private _isChecked;
  397. private _background;
  398. private _checkSizeRatio;
  399. private _thickness;
  400. thickness: number;
  401. onIsCheckedChangedObservable: Observable<boolean>;
  402. checkSizeRatio: number;
  403. background: string;
  404. isChecked: boolean;
  405. constructor(name?: string);
  406. protected _getTypeName(): string;
  407. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  408. protected _onPointerDown(coordinates: Vector2): boolean;
  409. }
  410. }
  411. declare var DOMImage: new (width?: number, height?: number) => HTMLImageElement;
  412. declare module BABYLON.GUI {
  413. class RadioButton extends Control {
  414. name: string;
  415. private _isChecked;
  416. private _background;
  417. private _checkSizeRatio;
  418. private _thickness;
  419. thickness: number;
  420. group: string;
  421. onIsCheckedChangedObservable: Observable<boolean>;
  422. checkSizeRatio: number;
  423. background: string;
  424. isChecked: boolean;
  425. constructor(name?: string);
  426. protected _getTypeName(): string;
  427. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  428. protected _onPointerDown(coordinates: Vector2): boolean;
  429. }
  430. }
  431. declare module BABYLON.GUI {
  432. class TextBlock extends Control {
  433. name: string;
  434. private _text;
  435. private _textY;
  436. private _textWrapping;
  437. private _textHorizontalAlignment;
  438. private _textVerticalAlignment;
  439. private _lines;
  440. private _totalHeight;
  441. textWrapping: boolean;
  442. text: string;
  443. textHorizontalAlignment: number;
  444. textVerticalAlignment: number;
  445. constructor(name?: string, text?: string);
  446. protected _getTypeName(): string;
  447. private _drawText(text, textWidth, y, context);
  448. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  449. protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  450. protected _parseLine(line: string, context: CanvasRenderingContext2D): object;
  451. protected _parseLineWithTextWrapping(line: string, context: CanvasRenderingContext2D): object;
  452. protected _renderLines(context: CanvasRenderingContext2D): void;
  453. }
  454. }
  455. declare var DOMImage: new (width?: number, height?: number) => HTMLImageElement;
  456. declare module BABYLON.GUI {
  457. class Image extends Control {
  458. name: string;
  459. private _domImage;
  460. private _imageWidth;
  461. private _imageHeight;
  462. private _loaded;
  463. private _stretch;
  464. private _source;
  465. private _autoScale;
  466. private _sourceLeft;
  467. private _sourceTop;
  468. private _sourceWidth;
  469. private _sourceHeight;
  470. sourceLeft: number;
  471. sourceTop: number;
  472. sourceWidth: number;
  473. sourceHeight: number;
  474. autoScale: boolean;
  475. stretch: number;
  476. domImage: HTMLImageElement;
  477. private _onImageLoaded();
  478. source: string;
  479. constructor(name?: string, url?: string);
  480. protected _getTypeName(): string;
  481. synchronizeSizeWithContent(): void;
  482. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  483. private static _STRETCH_NONE;
  484. private static _STRETCH_FILL;
  485. private static _STRETCH_UNIFORM;
  486. private static _STRETCH_EXTEND;
  487. static readonly STRETCH_NONE: number;
  488. static readonly STRETCH_FILL: number;
  489. static readonly STRETCH_UNIFORM: number;
  490. static readonly STRETCH_EXTEND: number;
  491. }
  492. }
  493. declare module BABYLON.GUI {
  494. class Button extends Rectangle {
  495. name: string;
  496. pointerEnterAnimation: () => void;
  497. pointerOutAnimation: () => void;
  498. pointerDownAnimation: () => void;
  499. pointerUpAnimation: () => void;
  500. constructor(name?: string);
  501. protected _getTypeName(): string;
  502. _processPicking(x: number, y: number, type: number): boolean;
  503. protected _onPointerEnter(): boolean;
  504. _onPointerOut(): void;
  505. protected _onPointerDown(coordinates: Vector2): boolean;
  506. protected _onPointerUp(coordinates: Vector2): void;
  507. static CreateImageButton(name: string, text: string, imageUrl: string): Button;
  508. static CreateImageOnlyButton(name: string, imageUrl: string): Button;
  509. static CreateSimpleButton(name: string, text: string): Button;
  510. }
  511. }
  512. declare var DOMImage: new (width?: number, height?: number) => HTMLImageElement;
  513. declare module BABYLON.GUI {
  514. class ColorPicker extends Control {
  515. name: string;
  516. private _colorWheelCanvas;
  517. private _value;
  518. private _tmpColor;
  519. private _pointerStartedOnSquare;
  520. private _pointerStartedOnWheel;
  521. private _squareLeft;
  522. private _squareTop;
  523. private _squareSize;
  524. private _h;
  525. private _s;
  526. private _v;
  527. onValueChangedObservable: Observable<Color3>;
  528. value: Color3;
  529. width: string | number;
  530. height: string | number;
  531. size: string | number;
  532. constructor(name?: string);
  533. protected _getTypeName(): string;
  534. private _updateSquareProps();
  535. private _drawGradientSquare(hueValue, left, top, width, height, context);
  536. private _drawCircle(centerX, centerY, radius, context);
  537. private _createColorWheelCanvas(radius, thickness);
  538. private _RGBtoHSV(color, result);
  539. private _HSVtoRGB(hue, saturation, value, result);
  540. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  541. private _pointerIsDown;
  542. private _updateValueFromPointer(x, y);
  543. private _isPointOnSquare(coordinates);
  544. private _isPointOnWheel(coordinates);
  545. protected _onPointerDown(coordinates: Vector2): boolean;
  546. protected _onPointerMove(coordinates: Vector2): void;
  547. protected _onPointerUp(coordinates: Vector2): void;
  548. }
  549. }
  550. declare module BABYLON.GUI {
  551. class InputText extends Control {
  552. name: string;
  553. private _text;
  554. private _background;
  555. private _thickness;
  556. private _margin;
  557. private _autoStretchWidth;
  558. private _maxWidth;
  559. maxWidth: string | number;
  560. margin: string;
  561. autoStretchWidth: boolean;
  562. thickness: number;
  563. background: string;
  564. text: string;
  565. constructor(name?: string, text?: string);
  566. protected _getTypeName(): string;
  567. _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
  568. }
  569. }