@babylonjs/gui 9.13.0 → 9.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/2D/FrameGraph/pure.d.ts +2 -0
- package/2D/FrameGraph/pure.js +3 -0
- package/2D/FrameGraph/pure.js.map +1 -0
- package/2D/FrameGraph/renderGraphGUIBlock.d.ts +3 -41
- package/2D/FrameGraph/renderGraphGUIBlock.js +5 -64
- package/2D/FrameGraph/renderGraphGUIBlock.js.map +1 -1
- package/2D/FrameGraph/renderGraphGUIBlock.pure.d.ts +48 -0
- package/2D/FrameGraph/renderGraphGUIBlock.pure.js +78 -0
- package/2D/FrameGraph/renderGraphGUIBlock.pure.js.map +1 -0
- package/2D/advancedDynamicTexture.d.ts +2 -2
- package/2D/advancedDynamicTexture.js +2 -2
- package/2D/advancedDynamicTexture.js.map +1 -1
- package/2D/controls/button.d.ts +3 -107
- package/2D/controls/button.js +5 -243
- package/2D/controls/button.js.map +1 -1
- package/2D/controls/button.pure.d.ts +114 -0
- package/2D/controls/button.pure.js +257 -0
- package/2D/controls/button.pure.js.map +1 -0
- package/2D/controls/checkbox.d.ts +3 -51
- package/2D/controls/checkbox.js +5 -161
- package/2D/controls/checkbox.js.map +1 -1
- package/2D/controls/checkbox.pure.d.ts +58 -0
- package/2D/controls/checkbox.pure.js +175 -0
- package/2D/controls/checkbox.pure.js.map +1 -0
- package/2D/controls/colorpicker.d.ts +5 -101
- package/2D/controls/colorpicker.js +7 -1394
- package/2D/controls/colorpicker.js.map +1 -1
- package/2D/controls/colorpicker.pure.d.ts +106 -0
- package/2D/controls/colorpicker.pure.js +1406 -0
- package/2D/controls/colorpicker.pure.js.map +1 -0
- package/2D/controls/container.d.ts +3 -177
- package/2D/controls/container.js +5 -615
- package/2D/controls/container.js.map +1 -1
- package/2D/controls/container.pure.d.ts +184 -0
- package/2D/controls/container.pure.js +629 -0
- package/2D/controls/container.pure.js.map +1 -0
- package/2D/controls/control.d.ts +3 -944
- package/2D/controls/control.js +5 -2457
- package/2D/controls/control.js.map +1 -1
- package/2D/controls/control.pure.d.ts +951 -0
- package/2D/controls/control.pure.js +2471 -0
- package/2D/controls/control.pure.js.map +1 -0
- package/2D/controls/displayGrid.d.ts +5 -53
- package/2D/controls/displayGrid.js +7 -201
- package/2D/controls/displayGrid.js.map +1 -1
- package/2D/controls/displayGrid.pure.d.ts +58 -0
- package/2D/controls/displayGrid.pure.js +213 -0
- package/2D/controls/displayGrid.pure.js.map +1 -0
- package/2D/controls/ellipse.d.ts +5 -25
- package/2D/controls/ellipse.js +7 -92
- package/2D/controls/ellipse.js.map +1 -1
- package/2D/controls/ellipse.pure.d.ts +30 -0
- package/2D/controls/ellipse.pure.js +104 -0
- package/2D/controls/ellipse.pure.js.map +1 -0
- package/2D/controls/focusableButton.d.ts +3 -15
- package/2D/controls/focusableButton.js +5 -22
- package/2D/controls/focusableButton.js.map +1 -1
- package/2D/controls/focusableButton.pure.d.ts +22 -0
- package/2D/controls/focusableButton.pure.js +36 -0
- package/2D/controls/focusableButton.pure.js.map +1 -0
- package/2D/controls/gradient/LinearGradient.d.ts +3 -43
- package/2D/controls/gradient/LinearGradient.js +5 -70
- package/2D/controls/gradient/LinearGradient.js.map +1 -1
- package/2D/controls/gradient/LinearGradient.pure.d.ts +50 -0
- package/2D/controls/gradient/LinearGradient.pure.js +84 -0
- package/2D/controls/gradient/LinearGradient.pure.js.map +1 -0
- package/2D/controls/gradient/RadialGradient.d.ts +3 -51
- package/2D/controls/gradient/RadialGradient.js +5 -86
- package/2D/controls/gradient/RadialGradient.js.map +1 -1
- package/2D/controls/gradient/RadialGradient.pure.d.ts +58 -0
- package/2D/controls/gradient/RadialGradient.pure.js +100 -0
- package/2D/controls/gradient/RadialGradient.pure.js.map +1 -0
- package/2D/controls/gradient/pure.d.ts +3 -0
- package/2D/controls/gradient/pure.js +4 -0
- package/2D/controls/gradient/pure.js.map +1 -0
- package/2D/controls/grid.d.ts +3 -149
- package/2D/controls/grid.js +5 -525
- package/2D/controls/grid.js.map +1 -1
- package/2D/controls/grid.pure.d.ts +156 -0
- package/2D/controls/grid.pure.js +539 -0
- package/2D/controls/grid.pure.js.map +1 -0
- package/2D/controls/image.d.ts +3 -226
- package/2D/controls/image.js +5 -913
- package/2D/controls/image.js.map +1 -1
- package/2D/controls/image.pure.d.ts +233 -0
- package/2D/controls/image.pure.js +927 -0
- package/2D/controls/image.pure.js.map +1 -0
- package/2D/controls/inputPassword.d.ts +3 -7
- package/2D/controls/inputPassword.js +5 -19
- package/2D/controls/inputPassword.js.map +1 -1
- package/2D/controls/inputPassword.pure.d.ts +14 -0
- package/2D/controls/inputPassword.pure.js +33 -0
- package/2D/controls/inputPassword.pure.js.map +1 -0
- package/2D/controls/inputText.d.ts +3 -202
- package/2D/controls/inputText.js +5 -1050
- package/2D/controls/inputText.js.map +1 -1
- package/2D/controls/inputText.pure.d.ts +209 -0
- package/2D/controls/inputText.pure.js +1064 -0
- package/2D/controls/inputText.pure.js.map +1 -0
- package/2D/controls/inputTextArea.d.ts +3 -140
- package/2D/controls/inputTextArea.js +5 -1023
- package/2D/controls/inputTextArea.js.map +1 -1
- package/2D/controls/inputTextArea.pure.d.ts +147 -0
- package/2D/controls/inputTextArea.pure.js +1037 -0
- package/2D/controls/inputTextArea.pure.js.map +1 -0
- package/2D/controls/line.d.ts +5 -74
- package/2D/controls/line.js +7 -234
- package/2D/controls/line.js.map +1 -1
- package/2D/controls/line.pure.d.ts +79 -0
- package/2D/controls/line.pure.js +246 -0
- package/2D/controls/line.pure.js.map +1 -0
- package/2D/controls/multiLine.d.ts +3 -73
- package/2D/controls/multiLine.js +5 -234
- package/2D/controls/multiLine.js.map +1 -1
- package/2D/controls/multiLine.pure.d.ts +80 -0
- package/2D/controls/multiLine.pure.js +248 -0
- package/2D/controls/multiLine.pure.js.map +1 -0
- package/2D/controls/pure.d.ts +38 -0
- package/2D/controls/pure.js +39 -0
- package/2D/controls/pure.js.map +1 -0
- package/2D/controls/radioButton.d.ts +3 -47
- package/2D/controls/radioButton.js +5 -182
- package/2D/controls/radioButton.js.map +1 -1
- package/2D/controls/radioButton.pure.d.ts +54 -0
- package/2D/controls/radioButton.pure.js +196 -0
- package/2D/controls/radioButton.pure.js.map +1 -0
- package/2D/controls/rectangle.d.ts +5 -43
- package/2D/controls/rectangle.js +7 -205
- package/2D/controls/rectangle.js.map +1 -1
- package/2D/controls/rectangle.pure.d.ts +48 -0
- package/2D/controls/rectangle.pure.js +217 -0
- package/2D/controls/rectangle.pure.js.map +1 -0
- package/2D/controls/scrollViewers/pure.d.ts +2 -0
- package/2D/controls/scrollViewers/pure.js +3 -0
- package/2D/controls/scrollViewers/pure.js.map +1 -0
- package/2D/controls/scrollViewers/scrollViewer.d.ts +3 -176
- package/2D/controls/scrollViewers/scrollViewer.js +5 -584
- package/2D/controls/scrollViewers/scrollViewer.js.map +1 -1
- package/2D/controls/scrollViewers/scrollViewer.pure.d.ts +183 -0
- package/2D/controls/scrollViewers/scrollViewer.pure.js +598 -0
- package/2D/controls/scrollViewers/scrollViewer.pure.js.map +1 -0
- package/2D/controls/scrollViewers/scrollViewerWindow.d.ts +1 -1
- package/2D/controls/scrollViewers/scrollViewerWindow.js +2 -2
- package/2D/controls/scrollViewers/scrollViewerWindow.js.map +1 -1
- package/2D/controls/selector.d.ts +2 -2
- package/2D/controls/selector.js +8 -8
- package/2D/controls/selector.js.map +1 -1
- package/2D/controls/sliders/baseSlider.d.ts +1 -1
- package/2D/controls/sliders/baseSlider.js +1 -1
- package/2D/controls/sliders/baseSlider.js.map +1 -1
- package/2D/controls/sliders/imageBasedSlider.d.ts +3 -45
- package/2D/controls/sliders/imageBasedSlider.js +5 -165
- package/2D/controls/sliders/imageBasedSlider.js.map +1 -1
- package/2D/controls/sliders/imageBasedSlider.pure.d.ts +52 -0
- package/2D/controls/sliders/imageBasedSlider.pure.js +179 -0
- package/2D/controls/sliders/imageBasedSlider.pure.js.map +1 -0
- package/2D/controls/sliders/pure.d.ts +4 -0
- package/2D/controls/sliders/pure.js +5 -0
- package/2D/controls/sliders/pure.js.map +1 -0
- package/2D/controls/sliders/scrollBar.d.ts +3 -48
- package/2D/controls/sliders/scrollBar.js +5 -170
- package/2D/controls/sliders/scrollBar.js.map +1 -1
- package/2D/controls/sliders/scrollBar.pure.d.ts +55 -0
- package/2D/controls/sliders/scrollBar.pure.js +184 -0
- package/2D/controls/sliders/scrollBar.pure.js.map +1 -0
- package/2D/controls/sliders/slider.d.ts +3 -44
- package/2D/controls/sliders/slider.js +5 -278
- package/2D/controls/sliders/slider.js.map +1 -1
- package/2D/controls/sliders/slider.pure.d.ts +51 -0
- package/2D/controls/sliders/slider.pure.js +292 -0
- package/2D/controls/sliders/slider.pure.js.map +1 -0
- package/2D/controls/stackPanel.d.ts +3 -62
- package/2D/controls/stackPanel.js +5 -243
- package/2D/controls/stackPanel.js.map +1 -1
- package/2D/controls/stackPanel.pure.d.ts +69 -0
- package/2D/controls/stackPanel.pure.js +257 -0
- package/2D/controls/stackPanel.pure.js.map +1 -0
- package/2D/controls/statics.d.ts +3 -4
- package/2D/controls/statics.js +5 -47
- package/2D/controls/statics.js.map +1 -1
- package/2D/controls/statics.pure.d.ts +11 -0
- package/2D/controls/statics.pure.js +61 -0
- package/2D/controls/statics.pure.js.map +1 -0
- package/2D/controls/textBlock.d.ts +3 -217
- package/2D/controls/textBlock.js +5 -676
- package/2D/controls/textBlock.js.map +1 -1
- package/2D/controls/textBlock.pure.d.ts +224 -0
- package/2D/controls/textBlock.pure.js +690 -0
- package/2D/controls/textBlock.pure.js.map +1 -0
- package/2D/controls/toggleButton.d.ts +3 -91
- package/2D/controls/toggleButton.js +5 -226
- package/2D/controls/toggleButton.js.map +1 -1
- package/2D/controls/toggleButton.pure.d.ts +98 -0
- package/2D/controls/toggleButton.pure.js +240 -0
- package/2D/controls/toggleButton.pure.js.map +1 -0
- package/2D/controls/virtualKeyboard.d.ts +3 -100
- package/2D/controls/virtualKeyboard.js +5 -272
- package/2D/controls/virtualKeyboard.js.map +1 -1
- package/2D/controls/virtualKeyboard.pure.d.ts +107 -0
- package/2D/controls/virtualKeyboard.pure.js +286 -0
- package/2D/controls/virtualKeyboard.pure.js.map +1 -0
- package/2D/math2D.d.ts +1 -1
- package/2D/math2D.js +1 -1
- package/2D/math2D.js.map +1 -1
- package/2D/measure.js +1 -1
- package/2D/measure.js.map +1 -1
- package/2D/pure.d.ts +13 -0
- package/2D/pure.js +15 -0
- package/2D/pure.js.map +1 -0
- package/3D/controls/MRTK3/touchHolographicButton.d.ts +4 -4
- package/3D/controls/MRTK3/touchHolographicButton.js +10 -10
- package/3D/controls/MRTK3/touchHolographicButton.js.map +1 -1
- package/3D/controls/holographicBackplate.d.ts +1 -1
- package/3D/controls/holographicBackplate.js +1 -1
- package/3D/controls/holographicBackplate.js.map +1 -1
- package/3D/controls/holographicButton.d.ts +1 -1
- package/3D/controls/holographicButton.js +4 -4
- package/3D/controls/holographicButton.js.map +1 -1
- package/3D/controls/holographicSlate.js +4 -4
- package/3D/controls/holographicSlate.js.map +1 -1
- package/3D/controls/pure.d.ts +23 -0
- package/3D/controls/pure.js +24 -0
- package/3D/controls/pure.js.map +1 -0
- package/3D/controls/slider3D.d.ts +3 -3
- package/3D/controls/slider3D.js +3 -3
- package/3D/controls/slider3D.js.map +1 -1
- package/3D/controls/touchHolographicButton.d.ts +2 -2
- package/3D/controls/touchHolographicButton.js +5 -5
- package/3D/controls/touchHolographicButton.js.map +1 -1
- package/3D/controls/touchHolographicMenu.js +1 -1
- package/3D/controls/touchHolographicMenu.js.map +1 -1
- package/3D/gizmos/gizmoHandle.d.ts +1 -1
- package/3D/gizmos/gizmoHandle.js +1 -1
- package/3D/gizmos/gizmoHandle.js.map +1 -1
- package/3D/gizmos/pure.d.ts +3 -0
- package/3D/gizmos/pure.js +4 -0
- package/3D/gizmos/pure.js.map +1 -0
- package/3D/materials/fluent/fluentMaterial.d.ts +5 -100
- package/3D/materials/fluent/fluentMaterial.js +7 -305
- package/3D/materials/fluent/fluentMaterial.js.map +1 -1
- package/3D/materials/fluent/fluentMaterial.pure.d.ts +105 -0
- package/3D/materials/fluent/fluentMaterial.pure.js +320 -0
- package/3D/materials/fluent/fluentMaterial.pure.js.map +1 -0
- package/3D/materials/fluent/pure.d.ts +2 -0
- package/3D/materials/fluent/pure.js +3 -0
- package/3D/materials/fluent/pure.js.map +1 -0
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.d.ts +5 -164
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.js +7 -488
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.js.map +1 -1
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.pure.d.ts +169 -0
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.pure.js +503 -0
- package/3D/materials/fluentBackplate/fluentBackplateMaterial.pure.js.map +1 -0
- package/3D/materials/fluentBackplate/pure.d.ts +2 -0
- package/3D/materials/fluentBackplate/pure.js +3 -0
- package/3D/materials/fluentBackplate/pure.js.map +1 -0
- package/3D/materials/fluentButton/fluentButtonMaterial.d.ts +5 -200
- package/3D/materials/fluentButton/fluentButtonMaterial.js +7 -563
- package/3D/materials/fluentButton/fluentButtonMaterial.js.map +1 -1
- package/3D/materials/fluentButton/fluentButtonMaterial.pure.d.ts +205 -0
- package/3D/materials/fluentButton/fluentButtonMaterial.pure.js +578 -0
- package/3D/materials/fluentButton/fluentButtonMaterial.pure.js.map +1 -0
- package/3D/materials/fluentButton/pure.d.ts +2 -0
- package/3D/materials/fluentButton/pure.js +3 -0
- package/3D/materials/fluentButton/pure.js.map +1 -0
- package/3D/materials/fluentMaterial.d.ts +1 -1
- package/3D/materials/fluentMaterial.js +1 -1
- package/3D/materials/fluentMaterial.js.map +1 -1
- package/3D/materials/handle/handleMaterial.d.ts +5 -66
- package/3D/materials/handle/handleMaterial.js +5 -118
- package/3D/materials/handle/handleMaterial.js.map +1 -1
- package/3D/materials/handle/handleMaterial.pure.d.ts +66 -0
- package/3D/materials/handle/handleMaterial.pure.js +121 -0
- package/3D/materials/handle/handleMaterial.pure.js.map +1 -0
- package/3D/materials/handle/pure.d.ts +2 -0
- package/3D/materials/handle/pure.js +3 -0
- package/3D/materials/handle/pure.js.map +1 -0
- package/3D/materials/mrdl/mrdlBackglowMaterial.d.ts +5 -85
- package/3D/materials/mrdl/mrdlBackglowMaterial.js +7 -299
- package/3D/materials/mrdl/mrdlBackglowMaterial.js.map +1 -1
- package/3D/materials/mrdl/mrdlBackglowMaterial.pure.d.ts +90 -0
- package/3D/materials/mrdl/mrdlBackglowMaterial.pure.js +314 -0
- package/3D/materials/mrdl/mrdlBackglowMaterial.pure.js.map +1 -0
- package/3D/materials/mrdl/mrdlBackplateMaterial.d.ts +5 -145
- package/3D/materials/mrdl/mrdlBackplateMaterial.js +7 -433
- package/3D/materials/mrdl/mrdlBackplateMaterial.js.map +1 -1
- package/3D/materials/mrdl/mrdlBackplateMaterial.pure.d.ts +157 -0
- package/3D/materials/mrdl/mrdlBackplateMaterial.pure.js +455 -0
- package/3D/materials/mrdl/mrdlBackplateMaterial.pure.js.map +1 -0
- package/3D/materials/mrdl/mrdlFrontplateMaterial.d.ts +5 -183
- package/3D/materials/mrdl/mrdlFrontplateMaterial.js +7 -532
- package/3D/materials/mrdl/mrdlFrontplateMaterial.js.map +1 -1
- package/3D/materials/mrdl/mrdlFrontplateMaterial.pure.d.ts +188 -0
- package/3D/materials/mrdl/mrdlFrontplateMaterial.pure.js +547 -0
- package/3D/materials/mrdl/mrdlFrontplateMaterial.pure.js.map +1 -0
- package/3D/materials/mrdl/mrdlInnerquadMaterial.d.ts +5 -54
- package/3D/materials/mrdl/mrdlInnerquadMaterial.js +7 -227
- package/3D/materials/mrdl/mrdlInnerquadMaterial.js.map +1 -1
- package/3D/materials/mrdl/mrdlInnerquadMaterial.pure.d.ts +59 -0
- package/3D/materials/mrdl/mrdlInnerquadMaterial.pure.js +242 -0
- package/3D/materials/mrdl/mrdlInnerquadMaterial.pure.js.map +1 -0
- package/3D/materials/mrdl/mrdlSliderBarMaterial.d.ts +5 -334
- package/3D/materials/mrdl/mrdlSliderBarMaterial.js +7 -855
- package/3D/materials/mrdl/mrdlSliderBarMaterial.js.map +1 -1
- package/3D/materials/mrdl/mrdlSliderBarMaterial.pure.d.ts +346 -0
- package/3D/materials/mrdl/mrdlSliderBarMaterial.pure.js +877 -0
- package/3D/materials/mrdl/mrdlSliderBarMaterial.pure.js.map +1 -0
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.d.ts +5 -334
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.js +7 -855
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.js.map +1 -1
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.pure.d.ts +346 -0
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.pure.js +877 -0
- package/3D/materials/mrdl/mrdlSliderThumbMaterial.pure.js.map +1 -0
- package/3D/materials/mrdl/pure.d.ts +7 -0
- package/3D/materials/mrdl/pure.js +8 -0
- package/3D/materials/mrdl/pure.js.map +1 -0
- package/3D/materials/pure.d.ts +6 -0
- package/3D/materials/pure.js +8 -0
- package/3D/materials/pure.js.map +1 -0
- package/3D/pure.d.ts +6 -0
- package/3D/pure.js +8 -0
- package/3D/pure.js.map +1 -0
- package/package.json +50 -3
- package/pure.d.ts +3 -0
- package/pure.js +5 -0
- package/pure.js.map +1 -0
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
import { type Nullable } from "@babylonjs/core/types.js";
|
|
2
|
+
import { Container } from "./container.pure.js";
|
|
3
|
+
import { ValueAndUnit } from "../valueAndUnit.js";
|
|
4
|
+
import { Control } from "./control.pure.js";
|
|
5
|
+
import { type Measure } from "../measure.js";
|
|
6
|
+
import { type ICanvasRenderingContext } from "@babylonjs/core/Engines/ICanvas.js";
|
|
7
|
+
import { type AdvancedDynamicTexture } from "../advancedDynamicTexture.js";
|
|
8
|
+
/**
|
|
9
|
+
* Class used to create a 2D grid container
|
|
10
|
+
*/
|
|
11
|
+
export declare class Grid extends Container {
|
|
12
|
+
name?: string | undefined;
|
|
13
|
+
private _rowDefinitions;
|
|
14
|
+
private _rowDefinitionObservers;
|
|
15
|
+
private _columnDefinitions;
|
|
16
|
+
private _columnDefinitionObservers;
|
|
17
|
+
private _cells;
|
|
18
|
+
private _childControls;
|
|
19
|
+
/**
|
|
20
|
+
* Sets/Gets a boolean indicating that control content must be clipped
|
|
21
|
+
* 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
|
|
22
|
+
*/
|
|
23
|
+
set clipContent(value: boolean);
|
|
24
|
+
get clipContent(): boolean;
|
|
25
|
+
/**
|
|
26
|
+
* Sets/Gets a boolean indicating if the children are clipped to the current control bounds.
|
|
27
|
+
* 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
|
|
28
|
+
*/
|
|
29
|
+
set clipChildren(value: boolean);
|
|
30
|
+
get clipChildren(): boolean;
|
|
31
|
+
/**
|
|
32
|
+
* Gets the number of columns
|
|
33
|
+
*/
|
|
34
|
+
get columnCount(): number;
|
|
35
|
+
/**
|
|
36
|
+
* Gets the number of rows
|
|
37
|
+
*/
|
|
38
|
+
get rowCount(): number;
|
|
39
|
+
/** Gets the list of children */
|
|
40
|
+
get children(): Control[];
|
|
41
|
+
/** Gets the list of cells (e.g. the containers) */
|
|
42
|
+
get cells(): {
|
|
43
|
+
[key: string]: Container;
|
|
44
|
+
};
|
|
45
|
+
/**
|
|
46
|
+
* Gets the definition of a specific row
|
|
47
|
+
* @param index defines the index of the row
|
|
48
|
+
* @returns the row definition
|
|
49
|
+
*/
|
|
50
|
+
getRowDefinition(index: number): Nullable<ValueAndUnit>;
|
|
51
|
+
/**
|
|
52
|
+
* Gets the definition of a specific column
|
|
53
|
+
* @param index defines the index of the column
|
|
54
|
+
* @returns the column definition
|
|
55
|
+
*/
|
|
56
|
+
getColumnDefinition(index: number): Nullable<ValueAndUnit>;
|
|
57
|
+
/**
|
|
58
|
+
* Adds a new row to the grid
|
|
59
|
+
* @param height defines the height of the row (either in pixel or a value between 0 and 1)
|
|
60
|
+
* @param isPixel defines if the height is expressed in pixel (or in percentage)
|
|
61
|
+
* @returns the current grid
|
|
62
|
+
*/
|
|
63
|
+
addRowDefinition(height: number, isPixel?: boolean): Grid;
|
|
64
|
+
/**
|
|
65
|
+
* Adds a new column to the grid
|
|
66
|
+
* @param width defines the width of the column (either in pixel or a value between 0 and 1)
|
|
67
|
+
* @param isPixel defines if the width is expressed in pixel (or in percentage)
|
|
68
|
+
* @returns the current grid
|
|
69
|
+
*/
|
|
70
|
+
addColumnDefinition(width: number, isPixel?: boolean): Grid;
|
|
71
|
+
/**
|
|
72
|
+
* Update a row definition
|
|
73
|
+
* @param index defines the index of the row to update
|
|
74
|
+
* @param height defines the height of the row (either in pixel or a value between 0 and 1)
|
|
75
|
+
* @param isPixel defines if the weight is expressed in pixel (or in percentage)
|
|
76
|
+
* @returns the current grid
|
|
77
|
+
*/
|
|
78
|
+
setRowDefinition(index: number, height: number, isPixel?: boolean): Grid;
|
|
79
|
+
/**
|
|
80
|
+
* Update a column definition
|
|
81
|
+
* @param index defines the index of the column to update
|
|
82
|
+
* @param width defines the width of the column (either in pixel or a value between 0 and 1)
|
|
83
|
+
* @param isPixel defines if the width is expressed in pixel (or in percentage)
|
|
84
|
+
* @returns the current grid
|
|
85
|
+
*/
|
|
86
|
+
setColumnDefinition(index: number, width: number, isPixel?: boolean): Grid;
|
|
87
|
+
/**
|
|
88
|
+
* Gets the list of children stored in a specific cell
|
|
89
|
+
* @param row defines the row to check
|
|
90
|
+
* @param column defines the column to check
|
|
91
|
+
* @returns the list of controls
|
|
92
|
+
*/
|
|
93
|
+
getChildrenAt(row: number, column: number): Nullable<Array<Control>>;
|
|
94
|
+
/**
|
|
95
|
+
* Gets a string representing the child cell info (row x column)
|
|
96
|
+
* @param child defines the control to get info from
|
|
97
|
+
* @returns a string containing the child cell info (row x column)
|
|
98
|
+
*/
|
|
99
|
+
getChildCellInfo(child: Control): string;
|
|
100
|
+
private _removeCell;
|
|
101
|
+
private _offsetCell;
|
|
102
|
+
/**
|
|
103
|
+
* Remove a column definition at specified index
|
|
104
|
+
* @param index defines the index of the column to remove
|
|
105
|
+
* @returns the current grid
|
|
106
|
+
*/
|
|
107
|
+
removeColumnDefinition(index: number): Grid;
|
|
108
|
+
/**
|
|
109
|
+
* Remove a row definition at specified index
|
|
110
|
+
* @param index defines the index of the row to remove
|
|
111
|
+
* @returns the current grid
|
|
112
|
+
*/
|
|
113
|
+
removeRowDefinition(index: number): Grid;
|
|
114
|
+
/**
|
|
115
|
+
* Adds a new control to the current grid
|
|
116
|
+
* @param control defines the control to add
|
|
117
|
+
* @param row defines the row where to add the control (0 by default)
|
|
118
|
+
* @param column defines the column where to add the control (0 by default)
|
|
119
|
+
* @returns the current grid
|
|
120
|
+
*/
|
|
121
|
+
addControl(control: Control, row?: number, column?: number): Grid;
|
|
122
|
+
/**
|
|
123
|
+
* Removes a control from the current container
|
|
124
|
+
* @param control defines the control to remove
|
|
125
|
+
* @returns the current container
|
|
126
|
+
*/
|
|
127
|
+
removeControl(control: Control): Container;
|
|
128
|
+
/**
|
|
129
|
+
* Creates a new Grid
|
|
130
|
+
* @param name defines control name
|
|
131
|
+
*/
|
|
132
|
+
constructor(name?: string | undefined);
|
|
133
|
+
protected _getTypeName(): string;
|
|
134
|
+
protected _getGridDefinitions(definitionCallback: (lefts: number[], tops: number[], widths: number[], heights: number[]) => void): void;
|
|
135
|
+
protected _additionalProcessing(parentMeasure: Measure, context: ICanvasRenderingContext): void;
|
|
136
|
+
_flagDescendantsAsMatrixDirty(): void;
|
|
137
|
+
_renderHighlightSpecific(context: ICanvasRenderingContext): void;
|
|
138
|
+
/** Releases associated resources */
|
|
139
|
+
dispose(): void;
|
|
140
|
+
/**
|
|
141
|
+
* Serializes the current control
|
|
142
|
+
* @param serializationObject defined the JSON serialized object
|
|
143
|
+
* @param force force serialization even if isSerializable === false
|
|
144
|
+
* @param allowCanvas defines if the control is allowed to use a Canvas2D object to serialize
|
|
145
|
+
*/
|
|
146
|
+
serialize(serializationObject: any, force: boolean, allowCanvas: boolean): void;
|
|
147
|
+
/**
|
|
148
|
+
* @internal
|
|
149
|
+
*/
|
|
150
|
+
_parseFromContent(serializedObject: any, host: AdvancedDynamicTexture): void;
|
|
151
|
+
}
|
|
152
|
+
/**
|
|
153
|
+
* Registers the Grid class with the type store for serialization support.
|
|
154
|
+
* Safe to call multiple times; only the first call has an effect.
|
|
155
|
+
*/
|
|
156
|
+
export declare function RegisterGrid(): void;
|
|
@@ -0,0 +1,539 @@
|
|
|
1
|
+
import { __decorate } from "@babylonjs/core/tslib.es6.js";
|
|
2
|
+
import { Container } from "./container.pure.js";
|
|
3
|
+
import { ValueAndUnit } from "../valueAndUnit.js";
|
|
4
|
+
import { Control } from "./control.pure.js";
|
|
5
|
+
import { Tools } from "@babylonjs/core/Misc/tools.pure.js";
|
|
6
|
+
import { RegisterClass } from "@babylonjs/core/Misc/typeStore.js";
|
|
7
|
+
import { serialize } from "@babylonjs/core/Misc/decorators.js";
|
|
8
|
+
/**
|
|
9
|
+
* Class used to create a 2D grid container
|
|
10
|
+
*/
|
|
11
|
+
export class Grid extends Container {
|
|
12
|
+
/**
|
|
13
|
+
* Sets/Gets a boolean indicating that control content must be clipped
|
|
14
|
+
* 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
|
|
15
|
+
*/
|
|
16
|
+
set clipContent(value) {
|
|
17
|
+
this._clipContent = value;
|
|
18
|
+
// This value has to be replicated on all of the container cells
|
|
19
|
+
for (const key in this._cells) {
|
|
20
|
+
this._cells[key].clipContent = value;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
get clipContent() {
|
|
24
|
+
return this._clipContent;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Sets/Gets a boolean indicating if the children are clipped to the current control bounds.
|
|
28
|
+
* 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
|
|
29
|
+
*/
|
|
30
|
+
set clipChildren(value) {
|
|
31
|
+
this._clipChildren = value;
|
|
32
|
+
// This value has to be replicated on all of the container cells
|
|
33
|
+
for (const key in this._cells) {
|
|
34
|
+
this._cells[key].clipChildren = value;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
get clipChildren() {
|
|
38
|
+
return this._clipChildren;
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* Gets the number of columns
|
|
42
|
+
*/
|
|
43
|
+
get columnCount() {
|
|
44
|
+
return this._columnDefinitions.length;
|
|
45
|
+
}
|
|
46
|
+
/**
|
|
47
|
+
* Gets the number of rows
|
|
48
|
+
*/
|
|
49
|
+
get rowCount() {
|
|
50
|
+
return this._rowDefinitions.length;
|
|
51
|
+
}
|
|
52
|
+
/** Gets the list of children */
|
|
53
|
+
get children() {
|
|
54
|
+
return this._childControls;
|
|
55
|
+
}
|
|
56
|
+
/** Gets the list of cells (e.g. the containers) */
|
|
57
|
+
get cells() {
|
|
58
|
+
return this._cells;
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* Gets the definition of a specific row
|
|
62
|
+
* @param index defines the index of the row
|
|
63
|
+
* @returns the row definition
|
|
64
|
+
*/
|
|
65
|
+
getRowDefinition(index) {
|
|
66
|
+
if (index < 0 || index >= this._rowDefinitions.length) {
|
|
67
|
+
return null;
|
|
68
|
+
}
|
|
69
|
+
return this._rowDefinitions[index];
|
|
70
|
+
}
|
|
71
|
+
/**
|
|
72
|
+
* Gets the definition of a specific column
|
|
73
|
+
* @param index defines the index of the column
|
|
74
|
+
* @returns the column definition
|
|
75
|
+
*/
|
|
76
|
+
getColumnDefinition(index) {
|
|
77
|
+
if (index < 0 || index >= this._columnDefinitions.length) {
|
|
78
|
+
return null;
|
|
79
|
+
}
|
|
80
|
+
return this._columnDefinitions[index];
|
|
81
|
+
}
|
|
82
|
+
/**
|
|
83
|
+
* Adds a new row to the grid
|
|
84
|
+
* @param height defines the height of the row (either in pixel or a value between 0 and 1)
|
|
85
|
+
* @param isPixel defines if the height is expressed in pixel (or in percentage)
|
|
86
|
+
* @returns the current grid
|
|
87
|
+
*/
|
|
88
|
+
addRowDefinition(height, isPixel = false) {
|
|
89
|
+
this._rowDefinitions.push(new ValueAndUnit(height, isPixel ? ValueAndUnit.UNITMODE_PIXEL : ValueAndUnit.UNITMODE_PERCENTAGE));
|
|
90
|
+
this._rowDefinitionObservers.push(this._rowDefinitions[this.rowCount - 1].onChangedObservable.add(() => this._markAsDirty()));
|
|
91
|
+
this._markAsDirty();
|
|
92
|
+
return this;
|
|
93
|
+
}
|
|
94
|
+
/**
|
|
95
|
+
* Adds a new column to the grid
|
|
96
|
+
* @param width defines the width of the column (either in pixel or a value between 0 and 1)
|
|
97
|
+
* @param isPixel defines if the width is expressed in pixel (or in percentage)
|
|
98
|
+
* @returns the current grid
|
|
99
|
+
*/
|
|
100
|
+
addColumnDefinition(width, isPixel = false) {
|
|
101
|
+
this._columnDefinitions.push(new ValueAndUnit(width, isPixel ? ValueAndUnit.UNITMODE_PIXEL : ValueAndUnit.UNITMODE_PERCENTAGE));
|
|
102
|
+
this._columnDefinitionObservers.push(this._columnDefinitions[this.columnCount - 1].onChangedObservable.add(() => this._markAsDirty()));
|
|
103
|
+
this._markAsDirty();
|
|
104
|
+
return this;
|
|
105
|
+
}
|
|
106
|
+
/**
|
|
107
|
+
* Update a row definition
|
|
108
|
+
* @param index defines the index of the row to update
|
|
109
|
+
* @param height defines the height of the row (either in pixel or a value between 0 and 1)
|
|
110
|
+
* @param isPixel defines if the weight is expressed in pixel (or in percentage)
|
|
111
|
+
* @returns the current grid
|
|
112
|
+
*/
|
|
113
|
+
setRowDefinition(index, height, isPixel = false) {
|
|
114
|
+
if (index < 0 || index >= this._rowDefinitions.length) {
|
|
115
|
+
return this;
|
|
116
|
+
}
|
|
117
|
+
const current = this._rowDefinitions[index];
|
|
118
|
+
if (current && current.isPixel === isPixel && current.value === height) {
|
|
119
|
+
return this;
|
|
120
|
+
}
|
|
121
|
+
this._rowDefinitions[index].onChangedObservable.remove(this._rowDefinitionObservers[index]);
|
|
122
|
+
this._rowDefinitions[index] = new ValueAndUnit(height, isPixel ? ValueAndUnit.UNITMODE_PIXEL : ValueAndUnit.UNITMODE_PERCENTAGE);
|
|
123
|
+
this._rowDefinitionObservers[index] = this._rowDefinitions[index].onChangedObservable.add(() => this._markAsDirty());
|
|
124
|
+
this._markAsDirty();
|
|
125
|
+
return this;
|
|
126
|
+
}
|
|
127
|
+
/**
|
|
128
|
+
* Update a column definition
|
|
129
|
+
* @param index defines the index of the column to update
|
|
130
|
+
* @param width defines the width of the column (either in pixel or a value between 0 and 1)
|
|
131
|
+
* @param isPixel defines if the width is expressed in pixel (or in percentage)
|
|
132
|
+
* @returns the current grid
|
|
133
|
+
*/
|
|
134
|
+
setColumnDefinition(index, width, isPixel = false) {
|
|
135
|
+
if (index < 0 || index >= this._columnDefinitions.length) {
|
|
136
|
+
return this;
|
|
137
|
+
}
|
|
138
|
+
const current = this._columnDefinitions[index];
|
|
139
|
+
if (current && current.isPixel === isPixel && current.value === width) {
|
|
140
|
+
return this;
|
|
141
|
+
}
|
|
142
|
+
this._columnDefinitions[index].onChangedObservable.remove(this._columnDefinitionObservers[index]);
|
|
143
|
+
this._columnDefinitions[index] = new ValueAndUnit(width, isPixel ? ValueAndUnit.UNITMODE_PIXEL : ValueAndUnit.UNITMODE_PERCENTAGE);
|
|
144
|
+
this._columnDefinitionObservers[index] = this._columnDefinitions[index].onChangedObservable.add(() => this._markAsDirty());
|
|
145
|
+
this._markAsDirty();
|
|
146
|
+
return this;
|
|
147
|
+
}
|
|
148
|
+
/**
|
|
149
|
+
* Gets the list of children stored in a specific cell
|
|
150
|
+
* @param row defines the row to check
|
|
151
|
+
* @param column defines the column to check
|
|
152
|
+
* @returns the list of controls
|
|
153
|
+
*/
|
|
154
|
+
getChildrenAt(row, column) {
|
|
155
|
+
const cell = this._cells[`${row}:${column}`];
|
|
156
|
+
if (!cell) {
|
|
157
|
+
return null;
|
|
158
|
+
}
|
|
159
|
+
return cell.children;
|
|
160
|
+
}
|
|
161
|
+
/**
|
|
162
|
+
* Gets a string representing the child cell info (row x column)
|
|
163
|
+
* @param child defines the control to get info from
|
|
164
|
+
* @returns a string containing the child cell info (row x column)
|
|
165
|
+
*/
|
|
166
|
+
getChildCellInfo(child) {
|
|
167
|
+
return child._tag;
|
|
168
|
+
}
|
|
169
|
+
_removeCell(cell, key) {
|
|
170
|
+
if (!cell) {
|
|
171
|
+
return;
|
|
172
|
+
}
|
|
173
|
+
super.removeControl(cell);
|
|
174
|
+
for (const control of cell.children) {
|
|
175
|
+
const childIndex = this._childControls.indexOf(control);
|
|
176
|
+
if (childIndex !== -1) {
|
|
177
|
+
this._childControls.splice(childIndex, 1);
|
|
178
|
+
}
|
|
179
|
+
}
|
|
180
|
+
delete this._cells[key];
|
|
181
|
+
}
|
|
182
|
+
_offsetCell(previousKey, key) {
|
|
183
|
+
if (!this._cells[key]) {
|
|
184
|
+
return;
|
|
185
|
+
}
|
|
186
|
+
this._cells[previousKey] = this._cells[key];
|
|
187
|
+
for (const control of this._cells[previousKey].children) {
|
|
188
|
+
control._tag = previousKey;
|
|
189
|
+
}
|
|
190
|
+
delete this._cells[key];
|
|
191
|
+
}
|
|
192
|
+
/**
|
|
193
|
+
* Remove a column definition at specified index
|
|
194
|
+
* @param index defines the index of the column to remove
|
|
195
|
+
* @returns the current grid
|
|
196
|
+
*/
|
|
197
|
+
removeColumnDefinition(index) {
|
|
198
|
+
if (index < 0 || index >= this._columnDefinitions.length) {
|
|
199
|
+
return this;
|
|
200
|
+
}
|
|
201
|
+
for (let x = 0; x < this._rowDefinitions.length; x++) {
|
|
202
|
+
const key = `${x}:${index}`;
|
|
203
|
+
const cell = this._cells[key];
|
|
204
|
+
this._removeCell(cell, key);
|
|
205
|
+
}
|
|
206
|
+
for (let x = 0; x < this._rowDefinitions.length; x++) {
|
|
207
|
+
for (let y = index + 1; y < this._columnDefinitions.length; y++) {
|
|
208
|
+
const previousKey = `${x}:${y - 1}`;
|
|
209
|
+
const key = `${x}:${y}`;
|
|
210
|
+
this._offsetCell(previousKey, key);
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
this._columnDefinitions[index].onChangedObservable.remove(this._columnDefinitionObservers[index]);
|
|
214
|
+
this._columnDefinitions.splice(index, 1);
|
|
215
|
+
this._columnDefinitionObservers.splice(index, 1);
|
|
216
|
+
this._markAsDirty();
|
|
217
|
+
return this;
|
|
218
|
+
}
|
|
219
|
+
/**
|
|
220
|
+
* Remove a row definition at specified index
|
|
221
|
+
* @param index defines the index of the row to remove
|
|
222
|
+
* @returns the current grid
|
|
223
|
+
*/
|
|
224
|
+
removeRowDefinition(index) {
|
|
225
|
+
if (index < 0 || index >= this._rowDefinitions.length) {
|
|
226
|
+
return this;
|
|
227
|
+
}
|
|
228
|
+
for (let y = 0; y < this._columnDefinitions.length; y++) {
|
|
229
|
+
const key = `${index}:${y}`;
|
|
230
|
+
const cell = this._cells[key];
|
|
231
|
+
this._removeCell(cell, key);
|
|
232
|
+
}
|
|
233
|
+
for (let y = 0; y < this._columnDefinitions.length; y++) {
|
|
234
|
+
for (let x = index + 1; x < this._rowDefinitions.length; x++) {
|
|
235
|
+
const previousKey = `${x - 1}:${y}`;
|
|
236
|
+
const key = `${x}:${y}`;
|
|
237
|
+
this._offsetCell(previousKey, key);
|
|
238
|
+
}
|
|
239
|
+
}
|
|
240
|
+
this._rowDefinitions[index].onChangedObservable.remove(this._rowDefinitionObservers[index]);
|
|
241
|
+
this._rowDefinitions.splice(index, 1);
|
|
242
|
+
this._rowDefinitionObservers.splice(index, 1);
|
|
243
|
+
this._markAsDirty();
|
|
244
|
+
return this;
|
|
245
|
+
}
|
|
246
|
+
/**
|
|
247
|
+
* Adds a new control to the current grid
|
|
248
|
+
* @param control defines the control to add
|
|
249
|
+
* @param row defines the row where to add the control (0 by default)
|
|
250
|
+
* @param column defines the column where to add the control (0 by default)
|
|
251
|
+
* @returns the current grid
|
|
252
|
+
*/
|
|
253
|
+
addControl(control, row = 0, column = 0) {
|
|
254
|
+
if (this._rowDefinitions.length === 0) {
|
|
255
|
+
// Add default row definition
|
|
256
|
+
this.addRowDefinition(1, false);
|
|
257
|
+
}
|
|
258
|
+
if (this._columnDefinitions.length === 0) {
|
|
259
|
+
// Add default column definition
|
|
260
|
+
this.addColumnDefinition(1, false);
|
|
261
|
+
}
|
|
262
|
+
if (this._childControls.indexOf(control) !== -1) {
|
|
263
|
+
Tools.Warn(`Control (Name:${control.name}, UniqueId:${control.uniqueId}) is already associated with this grid. You must remove it before reattaching it`);
|
|
264
|
+
return this;
|
|
265
|
+
}
|
|
266
|
+
const x = Math.min(row, this._rowDefinitions.length - 1);
|
|
267
|
+
const y = Math.min(column, this._columnDefinitions.length - 1);
|
|
268
|
+
const key = `${x}:${y}`;
|
|
269
|
+
let goodContainer = this._cells[key];
|
|
270
|
+
if (!goodContainer) {
|
|
271
|
+
goodContainer = new Container(key);
|
|
272
|
+
this._cells[key] = goodContainer;
|
|
273
|
+
goodContainer.horizontalAlignment = Control.HORIZONTAL_ALIGNMENT_LEFT;
|
|
274
|
+
goodContainer.verticalAlignment = Control.VERTICAL_ALIGNMENT_TOP;
|
|
275
|
+
goodContainer.clipContent = this.clipContent;
|
|
276
|
+
goodContainer.clipChildren = this.clipChildren;
|
|
277
|
+
super.addControl(goodContainer);
|
|
278
|
+
}
|
|
279
|
+
goodContainer.addControl(control);
|
|
280
|
+
this._childControls.push(control);
|
|
281
|
+
control._tag = key;
|
|
282
|
+
control.parent = this;
|
|
283
|
+
this._markAsDirty();
|
|
284
|
+
return this;
|
|
285
|
+
}
|
|
286
|
+
/**
|
|
287
|
+
* Removes a control from the current container
|
|
288
|
+
* @param control defines the control to remove
|
|
289
|
+
* @returns the current container
|
|
290
|
+
*/
|
|
291
|
+
removeControl(control) {
|
|
292
|
+
const index = this._childControls.indexOf(control);
|
|
293
|
+
if (index !== -1) {
|
|
294
|
+
this._childControls.splice(index, 1);
|
|
295
|
+
}
|
|
296
|
+
const cell = this._cells[control._tag];
|
|
297
|
+
if (cell) {
|
|
298
|
+
cell.removeControl(control);
|
|
299
|
+
control._tag = null;
|
|
300
|
+
}
|
|
301
|
+
this._markAsDirty();
|
|
302
|
+
return this;
|
|
303
|
+
}
|
|
304
|
+
/**
|
|
305
|
+
* Creates a new Grid
|
|
306
|
+
* @param name defines control name
|
|
307
|
+
*/
|
|
308
|
+
constructor(name) {
|
|
309
|
+
super(name);
|
|
310
|
+
this.name = name;
|
|
311
|
+
this._rowDefinitions = new Array();
|
|
312
|
+
this._rowDefinitionObservers = [];
|
|
313
|
+
this._columnDefinitions = new Array();
|
|
314
|
+
this._columnDefinitionObservers = [];
|
|
315
|
+
this._cells = {};
|
|
316
|
+
this._childControls = new Array();
|
|
317
|
+
}
|
|
318
|
+
_getTypeName() {
|
|
319
|
+
return "Grid";
|
|
320
|
+
}
|
|
321
|
+
_getGridDefinitions(definitionCallback) {
|
|
322
|
+
const widths = [];
|
|
323
|
+
const heights = [];
|
|
324
|
+
const lefts = [];
|
|
325
|
+
const tops = [];
|
|
326
|
+
let availableWidth = this._currentMeasure.width;
|
|
327
|
+
let globalWidthPercentage = 0;
|
|
328
|
+
let availableHeight = this._currentMeasure.height;
|
|
329
|
+
let globalHeightPercentage = 0;
|
|
330
|
+
// Heights
|
|
331
|
+
let index = 0;
|
|
332
|
+
for (const rowDefinition of this._rowDefinitions) {
|
|
333
|
+
if (rowDefinition.isPixel) {
|
|
334
|
+
const height = rowDefinition.getValue(this._host);
|
|
335
|
+
availableHeight -= height;
|
|
336
|
+
heights[index] = height;
|
|
337
|
+
}
|
|
338
|
+
else {
|
|
339
|
+
globalHeightPercentage += rowDefinition.value;
|
|
340
|
+
}
|
|
341
|
+
index++;
|
|
342
|
+
}
|
|
343
|
+
let top = 0;
|
|
344
|
+
index = 0;
|
|
345
|
+
for (const rowDefinition of this._rowDefinitions) {
|
|
346
|
+
tops.push(top);
|
|
347
|
+
if (!rowDefinition.isPixel) {
|
|
348
|
+
const height = Math.round((rowDefinition.value / globalHeightPercentage) * availableHeight);
|
|
349
|
+
top += height;
|
|
350
|
+
heights[index] = height;
|
|
351
|
+
}
|
|
352
|
+
else {
|
|
353
|
+
top += rowDefinition.getValue(this._host);
|
|
354
|
+
}
|
|
355
|
+
index++;
|
|
356
|
+
}
|
|
357
|
+
// Widths
|
|
358
|
+
index = 0;
|
|
359
|
+
for (const columnDefinition of this._columnDefinitions) {
|
|
360
|
+
if (columnDefinition.isPixel) {
|
|
361
|
+
const width = columnDefinition.getValue(this._host);
|
|
362
|
+
availableWidth -= width;
|
|
363
|
+
widths[index] = width;
|
|
364
|
+
}
|
|
365
|
+
else {
|
|
366
|
+
globalWidthPercentage += columnDefinition.value;
|
|
367
|
+
}
|
|
368
|
+
index++;
|
|
369
|
+
}
|
|
370
|
+
let left = 0;
|
|
371
|
+
index = 0;
|
|
372
|
+
for (const columnDefinition of this._columnDefinitions) {
|
|
373
|
+
lefts.push(left);
|
|
374
|
+
if (!columnDefinition.isPixel) {
|
|
375
|
+
const width = Math.round((columnDefinition.value / globalWidthPercentage) * availableWidth);
|
|
376
|
+
left += width;
|
|
377
|
+
widths[index] = width;
|
|
378
|
+
}
|
|
379
|
+
else {
|
|
380
|
+
left += columnDefinition.getValue(this._host);
|
|
381
|
+
}
|
|
382
|
+
index++;
|
|
383
|
+
}
|
|
384
|
+
definitionCallback(lefts, tops, widths, heights);
|
|
385
|
+
}
|
|
386
|
+
_additionalProcessing(parentMeasure, context) {
|
|
387
|
+
this._getGridDefinitions((lefts, tops, widths, heights) => {
|
|
388
|
+
// Setting child sizes
|
|
389
|
+
for (const key in this._cells) {
|
|
390
|
+
if (!Object.prototype.hasOwnProperty.call(this._cells, key)) {
|
|
391
|
+
continue;
|
|
392
|
+
}
|
|
393
|
+
const split = key.split(":");
|
|
394
|
+
const x = parseInt(split[0]);
|
|
395
|
+
const y = parseInt(split[1]);
|
|
396
|
+
const cell = this._cells[key];
|
|
397
|
+
cell.leftInPixels = lefts[y];
|
|
398
|
+
cell.topInPixels = tops[x];
|
|
399
|
+
cell.widthInPixels = widths[y];
|
|
400
|
+
cell.heightInPixels = heights[x];
|
|
401
|
+
cell._left.ignoreAdaptiveScaling = true;
|
|
402
|
+
cell._top.ignoreAdaptiveScaling = true;
|
|
403
|
+
cell._width.ignoreAdaptiveScaling = true;
|
|
404
|
+
cell._height.ignoreAdaptiveScaling = true;
|
|
405
|
+
}
|
|
406
|
+
});
|
|
407
|
+
super._additionalProcessing(parentMeasure, context);
|
|
408
|
+
}
|
|
409
|
+
_flagDescendantsAsMatrixDirty() {
|
|
410
|
+
for (const key in this._cells) {
|
|
411
|
+
if (!Object.prototype.hasOwnProperty.call(this._cells, key)) {
|
|
412
|
+
continue;
|
|
413
|
+
}
|
|
414
|
+
const child = this._cells[key];
|
|
415
|
+
child._markMatrixAsDirty();
|
|
416
|
+
}
|
|
417
|
+
}
|
|
418
|
+
_renderHighlightSpecific(context) {
|
|
419
|
+
super._renderHighlightSpecific(context);
|
|
420
|
+
this._getGridDefinitions((lefts, tops, widths, heights) => {
|
|
421
|
+
// Columns
|
|
422
|
+
for (let index = 0; index < lefts.length; index++) {
|
|
423
|
+
const left = this._currentMeasure.left + lefts[index] + widths[index];
|
|
424
|
+
context.beginPath();
|
|
425
|
+
context.moveTo(left, this._currentMeasure.top);
|
|
426
|
+
context.lineTo(left, this._currentMeasure.top + this._currentMeasure.height);
|
|
427
|
+
context.stroke();
|
|
428
|
+
}
|
|
429
|
+
// Rows
|
|
430
|
+
for (let index = 0; index < tops.length; index++) {
|
|
431
|
+
const top = this._currentMeasure.top + tops[index] + heights[index];
|
|
432
|
+
context.beginPath();
|
|
433
|
+
context.moveTo(this._currentMeasure.left, top);
|
|
434
|
+
context.lineTo(this._currentMeasure.left + this._currentMeasure.width, top);
|
|
435
|
+
context.stroke();
|
|
436
|
+
}
|
|
437
|
+
});
|
|
438
|
+
context.restore();
|
|
439
|
+
}
|
|
440
|
+
/** Releases associated resources */
|
|
441
|
+
dispose() {
|
|
442
|
+
super.dispose();
|
|
443
|
+
for (const control of this._childControls) {
|
|
444
|
+
control.dispose();
|
|
445
|
+
}
|
|
446
|
+
for (let index = 0; index < this._rowDefinitions.length; index++) {
|
|
447
|
+
this._rowDefinitions[index].onChangedObservable.remove(this._rowDefinitionObservers[index]);
|
|
448
|
+
}
|
|
449
|
+
for (let index = 0; index < this._columnDefinitions.length; index++) {
|
|
450
|
+
this._columnDefinitions[index].onChangedObservable.remove(this._columnDefinitionObservers[index]);
|
|
451
|
+
}
|
|
452
|
+
this._rowDefinitionObservers.length = 0;
|
|
453
|
+
this._rowDefinitions.length = 0;
|
|
454
|
+
this._columnDefinitionObservers.length = 0;
|
|
455
|
+
this._columnDefinitions.length = 0;
|
|
456
|
+
this._cells = {};
|
|
457
|
+
this._childControls.length = 0;
|
|
458
|
+
}
|
|
459
|
+
/**
|
|
460
|
+
* Serializes the current control
|
|
461
|
+
* @param serializationObject defined the JSON serialized object
|
|
462
|
+
* @param force force serialization even if isSerializable === false
|
|
463
|
+
* @param allowCanvas defines if the control is allowed to use a Canvas2D object to serialize
|
|
464
|
+
*/
|
|
465
|
+
serialize(serializationObject, force, allowCanvas) {
|
|
466
|
+
super.serialize(serializationObject, force, allowCanvas);
|
|
467
|
+
if (!this.isSerializable && !force) {
|
|
468
|
+
return;
|
|
469
|
+
}
|
|
470
|
+
serializationObject.columnCount = this.columnCount;
|
|
471
|
+
serializationObject.rowCount = this.rowCount;
|
|
472
|
+
serializationObject.columns = [];
|
|
473
|
+
serializationObject.rows = [];
|
|
474
|
+
serializationObject.tags = [];
|
|
475
|
+
for (let i = 0; i < this.columnCount; ++i) {
|
|
476
|
+
const cd = this.getColumnDefinition(i);
|
|
477
|
+
const childSerializationObject = { value: cd?.getValue(this.host), unit: cd?.unit };
|
|
478
|
+
serializationObject.columns.push(childSerializationObject);
|
|
479
|
+
}
|
|
480
|
+
for (let i = 0; i < this.rowCount; ++i) {
|
|
481
|
+
const rd = this.getRowDefinition(i);
|
|
482
|
+
const childSerializationObject = { value: rd?.getValue(this.host), unit: rd?.unit };
|
|
483
|
+
serializationObject.rows.push(childSerializationObject);
|
|
484
|
+
}
|
|
485
|
+
for (const child of this.children) {
|
|
486
|
+
serializationObject.tags.push(child._tag);
|
|
487
|
+
}
|
|
488
|
+
}
|
|
489
|
+
/**
|
|
490
|
+
* @internal
|
|
491
|
+
*/
|
|
492
|
+
_parseFromContent(serializedObject, host) {
|
|
493
|
+
super._parseFromContent(serializedObject, host);
|
|
494
|
+
const children = [];
|
|
495
|
+
for (const child of this.children) {
|
|
496
|
+
children.push(child);
|
|
497
|
+
}
|
|
498
|
+
this.removeRowDefinition(0);
|
|
499
|
+
this.removeColumnDefinition(0);
|
|
500
|
+
for (let i = 0; i < serializedObject.columnCount; ++i) {
|
|
501
|
+
const columnValue = serializedObject.columns[i].value;
|
|
502
|
+
const unit = serializedObject.columns[i].unit;
|
|
503
|
+
this.addColumnDefinition(columnValue, unit === 1 ? true : false);
|
|
504
|
+
}
|
|
505
|
+
for (let i = 0; i < serializedObject.rowCount; ++i) {
|
|
506
|
+
const rowValue = serializedObject.rows[i].value;
|
|
507
|
+
const unit = serializedObject.rows[i].unit;
|
|
508
|
+
this.addRowDefinition(rowValue, unit === 1 ? true : false);
|
|
509
|
+
}
|
|
510
|
+
for (let i = 0; i < children.length; ++i) {
|
|
511
|
+
const cellInfo = serializedObject.tags[i];
|
|
512
|
+
let rowNumber = parseInt(cellInfo.substring(0, cellInfo.search(":")));
|
|
513
|
+
if (isNaN(rowNumber)) {
|
|
514
|
+
rowNumber = 0;
|
|
515
|
+
}
|
|
516
|
+
let columnNumber = parseInt(cellInfo.substring(cellInfo.search(":") + 1));
|
|
517
|
+
if (isNaN(columnNumber)) {
|
|
518
|
+
columnNumber = 0;
|
|
519
|
+
}
|
|
520
|
+
this.addControl(children[i], rowNumber, columnNumber);
|
|
521
|
+
}
|
|
522
|
+
}
|
|
523
|
+
}
|
|
524
|
+
__decorate([
|
|
525
|
+
serialize()
|
|
526
|
+
], Grid.prototype, "clipContent", null);
|
|
527
|
+
let _Registered = false;
|
|
528
|
+
/**
|
|
529
|
+
* Registers the Grid class with the type store for serialization support.
|
|
530
|
+
* Safe to call multiple times; only the first call has an effect.
|
|
531
|
+
*/
|
|
532
|
+
export function RegisterGrid() {
|
|
533
|
+
if (_Registered) {
|
|
534
|
+
return;
|
|
535
|
+
}
|
|
536
|
+
_Registered = true;
|
|
537
|
+
RegisterClass("BABYLON.GUI.Grid", Grid);
|
|
538
|
+
}
|
|
539
|
+
//# sourceMappingURL=grid.pure.js.map
|