@babylonjs/gui 7.13.0 → 7.13.1
Sign up to get free protection for your applications and to get access to all the features.
- package/2D/advancedDynamicTexture.d.ts +9 -4
- package/2D/advancedDynamicTexture.js +44 -0
- package/2D/advancedDynamicTexture.js.map +1 -1
- package/2D/controls/control.d.ts +53 -1
- package/2D/controls/control.js +88 -0
- package/2D/controls/control.js.map +1 -1
- package/2D/controls/focusableButton.d.ts +0 -37
- package/2D/controls/focusableButton.js +0 -65
- package/2D/controls/focusableButton.js.map +1 -1
- package/2D/controls/focusableControl.d.ts +9 -0
- package/2D/controls/focusableControl.js.map +1 -1
- package/2D/controls/inputText.d.ts +1 -19
- package/2D/controls/inputText.js +2 -27
- package/2D/controls/inputText.js.map +1 -1
- package/2D/controls/virtualKeyboard.js.map +1 -1
- package/package.json +2 -2
@@ -1,54 +1,17 @@
|
|
1
|
-
import type { Nullable } from "@babylonjs/core/types.js";
|
2
1
|
import type { Vector2 } from "@babylonjs/core/Maths/math.vector.js";
|
3
2
|
import { Button } from "./button";
|
4
3
|
import type { Control } from "./control";
|
5
4
|
import type { PointerInfoBase } from "@babylonjs/core/Events/pointerEvents.js";
|
6
5
|
import type { IFocusableControl } from "./focusableControl";
|
7
|
-
import { Observable } from "@babylonjs/core/Misc/observable.js";
|
8
|
-
import type { IKeyboardEvent } from "@babylonjs/core/Events/deviceInputEvents.js";
|
9
6
|
/**
|
10
7
|
* Class used to create a focusable button that can easily handle keyboard events
|
11
8
|
* @since 5.0.0
|
12
9
|
*/
|
13
10
|
export declare class FocusableButton extends Button implements IFocusableControl {
|
14
11
|
name?: string | undefined;
|
15
|
-
/** Highlight color when button is focused */
|
16
|
-
focusedColor: Nullable<string>;
|
17
|
-
private _isFocused;
|
18
|
-
private _unfocusedColor;
|
19
|
-
/** Observable raised when the control gets the focus */
|
20
|
-
onFocusObservable: Observable<Button>;
|
21
|
-
/** Observable raised when the control loses the focus */
|
22
|
-
onBlurObservable: Observable<Button>;
|
23
|
-
/** Observable raised when a key event was processed */
|
24
|
-
onKeyboardEventProcessedObservable: Observable<IKeyboardEvent>;
|
25
12
|
constructor(name?: string | undefined);
|
26
|
-
/** @internal */
|
27
|
-
onBlur(): void;
|
28
|
-
/** @internal */
|
29
|
-
onFocus(): void;
|
30
|
-
/**
|
31
|
-
* Function called to get the list of controls that should not steal the focus from this control
|
32
|
-
* @returns an array of controls
|
33
|
-
*/
|
34
|
-
keepsFocusWith(): Nullable<Control[]>;
|
35
|
-
/**
|
36
|
-
* Function to focus a button programmatically
|
37
|
-
*/
|
38
|
-
focus(): void;
|
39
|
-
/**
|
40
|
-
* Function to unfocus a button programmatically
|
41
|
-
*/
|
42
|
-
blur(): void;
|
43
|
-
/**
|
44
|
-
* Handles the keyboard event
|
45
|
-
* @param evt Defines the KeyboardEvent
|
46
|
-
*/
|
47
|
-
processKeyboard(evt: IKeyboardEvent): void;
|
48
13
|
/**
|
49
14
|
* @internal
|
50
15
|
*/
|
51
16
|
_onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number, pi: PointerInfoBase): boolean;
|
52
|
-
/** @internal */
|
53
|
-
dispose(): void;
|
54
17
|
}
|
@@ -1,6 +1,5 @@
|
|
1
1
|
import { Button } from "./button.js";
|
2
2
|
import { RegisterClass } from "@babylonjs/core/Misc/typeStore.js";
|
3
|
-
import { Observable } from "@babylonjs/core/Misc/observable.js";
|
4
3
|
/**
|
5
4
|
* Class used to create a focusable button that can easily handle keyboard events
|
6
5
|
* @since 5.0.0
|
@@ -9,65 +8,8 @@ export class FocusableButton extends Button {
|
|
9
8
|
constructor(name) {
|
10
9
|
super(name);
|
11
10
|
this.name = name;
|
12
|
-
/** Highlight color when button is focused */
|
13
|
-
this.focusedColor = null;
|
14
|
-
this._isFocused = false;
|
15
|
-
this._unfocusedColor = null;
|
16
|
-
/** Observable raised when the control gets the focus */
|
17
|
-
this.onFocusObservable = new Observable();
|
18
|
-
/** Observable raised when the control loses the focus */
|
19
|
-
this.onBlurObservable = new Observable();
|
20
|
-
/** Observable raised when a key event was processed */
|
21
|
-
this.onKeyboardEventProcessedObservable = new Observable();
|
22
11
|
this._unfocusedColor = this.color;
|
23
12
|
}
|
24
|
-
/** @internal */
|
25
|
-
onBlur() {
|
26
|
-
if (this._isFocused) {
|
27
|
-
this._isFocused = false;
|
28
|
-
if (this.focusedColor && this._unfocusedColor != null) {
|
29
|
-
// Set color back to saved unfocused color
|
30
|
-
this.color = this._unfocusedColor;
|
31
|
-
}
|
32
|
-
this.onBlurObservable.notifyObservers(this);
|
33
|
-
}
|
34
|
-
}
|
35
|
-
/** @internal */
|
36
|
-
onFocus() {
|
37
|
-
this._isFocused = true;
|
38
|
-
if (this.focusedColor) {
|
39
|
-
// Save the unfocused color
|
40
|
-
this._unfocusedColor = this.color;
|
41
|
-
this.color = this.focusedColor;
|
42
|
-
}
|
43
|
-
this.onFocusObservable.notifyObservers(this);
|
44
|
-
}
|
45
|
-
/**
|
46
|
-
* Function called to get the list of controls that should not steal the focus from this control
|
47
|
-
* @returns an array of controls
|
48
|
-
*/
|
49
|
-
keepsFocusWith() {
|
50
|
-
return null;
|
51
|
-
}
|
52
|
-
/**
|
53
|
-
* Function to focus a button programmatically
|
54
|
-
*/
|
55
|
-
focus() {
|
56
|
-
this._host.moveFocusToControl(this);
|
57
|
-
}
|
58
|
-
/**
|
59
|
-
* Function to unfocus a button programmatically
|
60
|
-
*/
|
61
|
-
blur() {
|
62
|
-
this._host.focusedControl = null;
|
63
|
-
}
|
64
|
-
/**
|
65
|
-
* Handles the keyboard event
|
66
|
-
* @param evt Defines the KeyboardEvent
|
67
|
-
*/
|
68
|
-
processKeyboard(evt) {
|
69
|
-
this.onKeyboardEventProcessedObservable.notifyObservers(evt, -1, this);
|
70
|
-
}
|
71
13
|
/**
|
72
14
|
* @internal
|
73
15
|
*/
|
@@ -78,13 +20,6 @@ export class FocusableButton extends Button {
|
|
78
20
|
}
|
79
21
|
return super._onPointerDown(target, coordinates, pointerId, buttonIndex, pi);
|
80
22
|
}
|
81
|
-
/** @internal */
|
82
|
-
dispose() {
|
83
|
-
super.dispose();
|
84
|
-
this.onBlurObservable.clear();
|
85
|
-
this.onFocusObservable.clear();
|
86
|
-
this.onKeyboardEventProcessedObservable.clear();
|
87
|
-
}
|
88
23
|
}
|
89
24
|
RegisterClass("BABYLON.GUI.FocusableButton", FocusableButton);
|
90
25
|
//# sourceMappingURL=focusableButton.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"focusableButton.js","sourceRoot":"","sources":["../../../../../dev/gui/src/2D/controls/focusableButton.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"file":"focusableButton.js","sourceRoot":"","sources":["../../../../../dev/gui/src/2D/controls/focusableButton.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,OAAO,EAAE,aAAa,EAAE,0CAA4B;AAIpD;;;GAGG;AACH,MAAM,OAAO,eAAgB,SAAQ,MAAM;IACvC,YAA4B,IAAa;QACrC,KAAK,CAAC,IAAI,CAAC,CAAC;QADY,SAAI,GAAJ,IAAI,CAAS;QAGrC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC;IACtC,CAAC;IAED;;OAEG;IACa,cAAc,CAAC,MAAe,EAAE,WAAoB,EAAE,SAAiB,EAAE,WAAmB,EAAE,EAAmB;QAC7H,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;YAClB,kCAAkC;YAClC,IAAI,CAAC,KAAK,EAAE,CAAC;SAChB;QAED,OAAO,KAAK,CAAC,cAAc,CAAC,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,CAAC,CAAC;IACjF,CAAC;CACJ;AACD,aAAa,CAAC,6BAA6B,EAAE,eAAe,CAAC,CAAC","sourcesContent":["import type { Vector2 } from \"core/Maths/math.vector\";\r\n\r\nimport { Button } from \"./button\";\r\nimport type { Control } from \"./control\";\r\nimport { RegisterClass } from \"core/Misc/typeStore\";\r\nimport type { PointerInfoBase } from \"core/Events/pointerEvents\";\r\nimport type { IFocusableControl } from \"./focusableControl\";\r\n\r\n/**\r\n * Class used to create a focusable button that can easily handle keyboard events\r\n * @since 5.0.0\r\n */\r\nexport class FocusableButton extends Button implements IFocusableControl {\r\n constructor(public override name?: string) {\r\n super(name);\r\n\r\n this._unfocusedColor = this.color;\r\n }\r\n\r\n /**\r\n * @internal\r\n */\r\n public override _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number, pi: PointerInfoBase): boolean {\r\n if (!this.isReadOnly) {\r\n // Clicking on button should focus\r\n this.focus();\r\n }\r\n\r\n return super._onPointerDown(target, coordinates, pointerId, buttonIndex, pi);\r\n }\r\n}\r\nRegisterClass(\"BABYLON.GUI.FocusableButton\", FocusableButton);\r\n"]}
|
@@ -31,4 +31,13 @@ export interface IFocusableControl {
|
|
31
31
|
* Function to unfocus the control programmatically
|
32
32
|
*/
|
33
33
|
blur(): void;
|
34
|
+
/**
|
35
|
+
* Gets or sets the tabIndex of the control
|
36
|
+
*/
|
37
|
+
tabIndex?: number;
|
38
|
+
/**
|
39
|
+
* Gets or sets the color used to draw the focus border
|
40
|
+
* Defaults to "white"
|
41
|
+
*/
|
42
|
+
focusBorderColor?: string;
|
34
43
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"focusableControl.js","sourceRoot":"","sources":["../../../../../dev/gui/src/2D/controls/focusableControl.ts"],"names":[],"mappings":"","sourcesContent":["import type { IKeyboardEvent } from \"core/Events/deviceInputEvents\";\r\nimport type { Nullable } from \"core/types\";\r\nimport type { Control } from \"./control\";\r\n\r\n/**\r\n * Interface used to define a control that can receive focus\r\n */\r\nexport interface IFocusableControl {\r\n /**\r\n * Function called when the control receives the focus\r\n */\r\n onFocus(): void;\r\n /**\r\n * Function called when the control loses the focus\r\n */\r\n onBlur(): void;\r\n /**\r\n * Function called to let the control handle keyboard events\r\n * @param evt defines the current keyboard event\r\n */\r\n processKeyboard(evt: IKeyboardEvent): void;\r\n /**\r\n * Function called to get the list of controls that should not steal the focus from this control\r\n * @returns an array of controls\r\n */\r\n keepsFocusWith(): Nullable<Control[]>;\r\n /**\r\n * Function to focus the control programmatically\r\n */\r\n focus(): void;\r\n /**\r\n * Function to unfocus the control programmatically\r\n */\r\n blur(): void;\r\n}\r\n"]}
|
1
|
+
{"version":3,"file":"focusableControl.js","sourceRoot":"","sources":["../../../../../dev/gui/src/2D/controls/focusableControl.ts"],"names":[],"mappings":"","sourcesContent":["import type { IKeyboardEvent } from \"core/Events/deviceInputEvents\";\r\nimport type { Nullable } from \"core/types\";\r\nimport type { Control } from \"./control\";\r\n\r\n/**\r\n * Interface used to define a control that can receive focus\r\n */\r\nexport interface IFocusableControl {\r\n /**\r\n * Function called when the control receives the focus\r\n */\r\n onFocus(): void;\r\n /**\r\n * Function called when the control loses the focus\r\n */\r\n onBlur(): void;\r\n /**\r\n * Function called to let the control handle keyboard events\r\n * @param evt defines the current keyboard event\r\n */\r\n processKeyboard(evt: IKeyboardEvent): void;\r\n /**\r\n * Function called to get the list of controls that should not steal the focus from this control\r\n * @returns an array of controls\r\n */\r\n keepsFocusWith(): Nullable<Control[]>;\r\n /**\r\n * Function to focus the control programmatically\r\n */\r\n focus(): void;\r\n /**\r\n * Function to unfocus the control programmatically\r\n */\r\n blur(): void;\r\n\r\n /**\r\n * Gets or sets the tabIndex of the control\r\n */\r\n tabIndex?: number;\r\n\r\n /**\r\n * Gets or sets the color used to draw the focus border\r\n * Defaults to \"white\"\r\n */\r\n focusBorderColor?: string;\r\n}\r\n"]}
|
@@ -5,7 +5,6 @@ import type { Vector2 } from "@babylonjs/core/Maths/math.vector.js";
|
|
5
5
|
import type { ClipboardInfo } from "@babylonjs/core/Events/clipboardEvents.js";
|
6
6
|
import type { PointerInfo, PointerInfoBase } from "@babylonjs/core/Events/pointerEvents.js";
|
7
7
|
import { Control } from "./control";
|
8
|
-
import type { IFocusableControl } from "./focusableControl";
|
9
8
|
import { ValueAndUnit } from "../valueAndUnit";
|
10
9
|
import type { VirtualKeyboard } from "./virtualKeyboard";
|
11
10
|
import { TextWrapper } from "./textWrapper";
|
@@ -14,19 +13,17 @@ import type { ICanvasRenderingContext } from "@babylonjs/core/Engines/ICanvas.js
|
|
14
13
|
/**
|
15
14
|
* Class used to create input text control
|
16
15
|
*/
|
17
|
-
export declare class InputText extends Control
|
16
|
+
export declare class InputText extends Control {
|
18
17
|
name?: string | undefined;
|
19
18
|
protected _textWrapper: TextWrapper;
|
20
19
|
protected _placeholderText: string;
|
21
20
|
protected _background: string;
|
22
21
|
protected _focusedBackground: string;
|
23
|
-
protected _focusedColor: string;
|
24
22
|
protected _placeholderColor: string;
|
25
23
|
protected _thickness: number;
|
26
24
|
protected _margin: ValueAndUnit;
|
27
25
|
protected _autoStretchWidth: boolean;
|
28
26
|
protected _maxWidth: ValueAndUnit;
|
29
|
-
protected _isFocused: boolean;
|
30
27
|
/** the type of device that most recently focused the input: "mouse", "touch" or "pen" */
|
31
28
|
protected _focusedBy: string;
|
32
29
|
protected _blinkTimeout: number;
|
@@ -71,10 +68,6 @@ export declare class InputText extends Control implements IFocusableControl {
|
|
71
68
|
onTextChangedObservable: Observable<InputText>;
|
72
69
|
/** Observable raised just before an entered character is to be added */
|
73
70
|
onBeforeKeyAddObservable: Observable<InputText>;
|
74
|
-
/** Observable raised when the control gets the focus */
|
75
|
-
onFocusObservable: Observable<InputText>;
|
76
|
-
/** Observable raised when the control loses the focus */
|
77
|
-
onBlurObservable: Observable<InputText>;
|
78
71
|
/** Observable raised when the text is highlighted */
|
79
72
|
onTextHighlightObservable: Observable<InputText>;
|
80
73
|
/** Observable raised when copy event is triggered */
|
@@ -83,8 +76,6 @@ export declare class InputText extends Control implements IFocusableControl {
|
|
83
76
|
onTextCutObservable: Observable<InputText>;
|
84
77
|
/** Observable raised when paste event is triggered */
|
85
78
|
onTextPasteObservable: Observable<InputText>;
|
86
|
-
/** Observable raised when a key event was processed */
|
87
|
-
onKeyboardEventProcessedObservable: Observable<IKeyboardEvent>;
|
88
79
|
/** Gets or sets the maximum width allowed by the control */
|
89
80
|
get maxWidth(): string | number;
|
90
81
|
/** Gets the maximum width allowed by the control in pixels */
|
@@ -114,7 +105,6 @@ export declare class InputText extends Control implements IFocusableControl {
|
|
114
105
|
get focusedBackground(): string;
|
115
106
|
set focusedBackground(value: string);
|
116
107
|
/** Gets or sets the background color when focused */
|
117
|
-
get focusedColor(): string;
|
118
108
|
set focusedColor(value: string);
|
119
109
|
/** Gets or sets the background color */
|
120
110
|
get background(): string;
|
@@ -155,14 +145,6 @@ export declare class InputText extends Control implements IFocusableControl {
|
|
155
145
|
onBlur(): void;
|
156
146
|
/** @internal */
|
157
147
|
onFocus(): void;
|
158
|
-
/**
|
159
|
-
* Function to focus an inputText programmatically
|
160
|
-
*/
|
161
|
-
focus(): void;
|
162
|
-
/**
|
163
|
-
* Function to unfocus an inputText programmatically
|
164
|
-
*/
|
165
|
-
blur(): void;
|
166
148
|
protected _getTypeName(): string;
|
167
149
|
/**
|
168
150
|
* Function called to get the list of controls that should not steal the focus from this control
|
package/2D/controls/inputText.js
CHANGED
@@ -136,9 +136,6 @@ export class InputText extends Control {
|
|
136
136
|
this._markAsDirty();
|
137
137
|
}
|
138
138
|
/** Gets or sets the background color when focused */
|
139
|
-
get focusedColor() {
|
140
|
-
return this._focusedColor;
|
141
|
-
}
|
142
139
|
set focusedColor(value) {
|
143
140
|
if (this._focusedColor === value) {
|
144
141
|
return;
|
@@ -261,13 +258,11 @@ export class InputText extends Control {
|
|
261
258
|
this._placeholderText = "";
|
262
259
|
this._background = "#222222";
|
263
260
|
this._focusedBackground = "#000000";
|
264
|
-
this._focusedColor = "white";
|
265
261
|
this._placeholderColor = "gray";
|
266
262
|
this._thickness = 1;
|
267
263
|
this._margin = new ValueAndUnit(10, ValueAndUnit.UNITMODE_PIXEL);
|
268
264
|
this._autoStretchWidth = true;
|
269
265
|
this._maxWidth = new ValueAndUnit(1, ValueAndUnit.UNITMODE_PERCENTAGE, false);
|
270
|
-
this._isFocused = false;
|
271
266
|
this._blinkIsEven = false;
|
272
267
|
this._cursorOffset = 0;
|
273
268
|
this._deadKey = false;
|
@@ -292,10 +287,6 @@ export class InputText extends Control {
|
|
292
287
|
this.onTextChangedObservable = new Observable();
|
293
288
|
/** Observable raised just before an entered character is to be added */
|
294
289
|
this.onBeforeKeyAddObservable = new Observable();
|
295
|
-
/** Observable raised when the control gets the focus */
|
296
|
-
this.onFocusObservable = new Observable();
|
297
|
-
/** Observable raised when the control loses the focus */
|
298
|
-
this.onBlurObservable = new Observable();
|
299
290
|
/** Observable raised when the text is highlighted */
|
300
291
|
this.onTextHighlightObservable = new Observable();
|
301
292
|
/** Observable raised when copy event is triggered */
|
@@ -304,10 +295,9 @@ export class InputText extends Control {
|
|
304
295
|
this.onTextCutObservable = new Observable();
|
305
296
|
/** Observable raised when paste event is triggered */
|
306
297
|
this.onTextPasteObservable = new Observable();
|
307
|
-
/** Observable raised when a key event was processed */
|
308
|
-
this.onKeyboardEventProcessedObservable = new Observable();
|
309
298
|
this.text = text;
|
310
299
|
this.isPointerBlocker = true;
|
300
|
+
this._focusedColor = "white";
|
311
301
|
}
|
312
302
|
/** @internal */
|
313
303
|
onBlur() {
|
@@ -381,18 +371,6 @@ export class InputText extends Control {
|
|
381
371
|
this._selectAllText();
|
382
372
|
}
|
383
373
|
}
|
384
|
-
/**
|
385
|
-
* Function to focus an inputText programmatically
|
386
|
-
*/
|
387
|
-
focus() {
|
388
|
-
this._host.moveFocusToControl(this);
|
389
|
-
}
|
390
|
-
/**
|
391
|
-
* Function to unfocus an inputText programmatically
|
392
|
-
*/
|
393
|
-
blur() {
|
394
|
-
this._host.focusedControl = null;
|
395
|
-
}
|
396
374
|
_getTypeName() {
|
397
375
|
return "InputText";
|
398
376
|
}
|
@@ -730,7 +708,7 @@ export class InputText extends Control {
|
|
730
708
|
processKeyboard(evt) {
|
731
709
|
// process pressed key
|
732
710
|
this.processKey(evt.keyCode, evt.key, evt);
|
733
|
-
|
711
|
+
super.processKeyboard(evt);
|
734
712
|
}
|
735
713
|
/**
|
736
714
|
* @internal
|
@@ -1033,9 +1011,6 @@ __decorate([
|
|
1033
1011
|
__decorate([
|
1034
1012
|
serialize()
|
1035
1013
|
], InputText.prototype, "focusedBackground", null);
|
1036
|
-
__decorate([
|
1037
|
-
serialize()
|
1038
|
-
], InputText.prototype, "focusedColor", null);
|
1039
1014
|
__decorate([
|
1040
1015
|
serialize()
|
1041
1016
|
], InputText.prototype, "background", null);
|