Class: FlyoutButton
Defined in: packages/blockly/core/flyout_button.ts:35
Class for a button or label in the flyout.
Implements
Properties index
| Property | Description |
|---|---|
| TEXT_MARGIN_X | The horizontal margin around the text in the button. |
| TEXT_MARGIN_Y | The vertical margin around the text in the button. |
| BORDER_RADIUS | The radius of the flyout button's borders. |
| callbackKey | The key to the function called when this button is activated. |
| info | - |
| width | The width of the button's rect. |
| height | The height of the button's rect. |
| cursorSvg | Holds the cursors svg element when the cursor is attached to the button. This is null if there is no cursor on the button. |
Methods index
| Method | Description |
|---|---|
| createDom | - |
| show | Correctly position the flyout button and make it visible. |
| moveTo | Move the button to the given x, y coordinates. |
| moveBy | Move the element by a relative offset. |
| isLabel | Returns whether or not the button is a label. |
| getBoundingRectangle | Returns the coordinates of a bounded element describing the dimensions of the element. Coordinate system: workspace coordinates. |
| getButtonText | Returns text of the button. |
| getTargetWorkspace | Get the button's target workspace. |
| getWorkspace | Get the button's workspace. |
| dispose | Dispose of this button. |
| setCursorSvg | Add the cursor SVG to this buttons's SVG group. |
| getSvgRoot | Returns the root SVG element of this rendered element. |
| getFocusableElement | See IFocusableNode.getFocusableElement. |
| getFocusableTree | See IFocusableNode.getFocusableTree. |
| onNodeFocus | See IFocusableNode.onNodeFocus. |
| onNodeBlur | See IFocusableNode.onNodeBlur. |
| canBeFocused | See IFocusableNode.canBeFocused. |
| getId | Returns the ID of this FlyoutButton. |
| performAction | Handles the user acting on this button via keyboard navigation. Invokes the click handler callback for buttons. For labels, which are not interactive, shows a toast directing the user to navigate using the arrow keys or the next-heading shortcut. |
Properties
TEXT_MARGIN_X
static TEXT_MARGIN_X: number = 5;
Defined in: packages/blockly/core/flyout_button.ts:39
The horizontal margin around the text in the button.
TEXT_MARGIN_Y
static TEXT_MARGIN_Y: number = 2;
Defined in: packages/blockly/core/flyout_button.ts:42
The vertical margin around the text in the button.
BORDER_RADIUS
static BORDER_RADIUS: number = 4;
Defined in: packages/blockly/core/flyout_button.ts:45
The radius of the flyout button's borders.
callbackKey
readonly callbackKey: string;
Defined in: packages/blockly/core/flyout_button.ts:48
The key to the function called when this button is activated.
info
info: ButtonOrLabelInfo;
Defined in: packages/blockly/core/flyout_button.ts:57
width
width: number = 0;
Defined in: packages/blockly/core/flyout_button.ts:60
The width of the button's rect.
height
height: number = 0;
Defined in: packages/blockly/core/flyout_button.ts:63
The height of the button's rect.
cursorSvg
cursorSvg: SVGElement | null = null;
Defined in: packages/blockly/core/flyout_button.ts:75
Holds the cursors svg element when the cursor is attached to the button. This is null if there is no cursor on the button.
Methods
createDom()
createDom(): SVGElement;
Defined in: packages/blockly/core/flyout_button.ts:233
Returns
SVGElement
show()
show(): void;
Defined in: packages/blockly/core/flyout_button.ts:240
Correctly position the flyout button and make it visible.
Returns
void
moveTo()
moveTo(x, y): void;
Defined in: packages/blockly/core/flyout_button.ts:259
Move the button to the given x, y coordinates.
Parameters
| Parameter | Type | Description |
|---|---|---|
x | number | The new x coordinate. |
y | number | The new y coordinate. |
Returns
void
moveBy()
moveBy(
dx,
dy,
_reason?
): void;
Defined in: packages/blockly/core/flyout_button.ts:272
Move the element by a relative offset.
Parameters
| Parameter | Type | Description |
|---|---|---|
dx | number | Horizontal offset in workspace units. |
dy | number | Vertical offset in workspace units. |
_reason? | string[] | Why is this move happening? 'user', 'bump', 'snap'... |
Returns
void
Implementation of
isLabel()
isLabel(): boolean;
Defined in: packages/blockly/core/flyout_button.ts:277
Returns
boolean
Whether or not the button is a label.
getBoundingRectangle()
getBoundingRectangle(): Rect;
Defined in: packages/blockly/core/flyout_button.ts:297
Returns the coordinates of a bounded element describing the dimensions of the element. Coordinate system: workspace coordinates.
Returns
Object with coordinates of the bounded element.
Implementation of
IBoundedElement.getBoundingRectangle
getButtonText()
getButtonText(): string;
Defined in: packages/blockly/core/flyout_button.ts:307
Returns
string
Text of the button.
getTargetWorkspace()
getTargetWorkspace(): WorkspaceSvg;
Defined in: packages/blockly/core/flyout_button.ts:316
Get the button's target workspace.
Returns
The target workspace of the flyout where this button resides.
getWorkspace()
getWorkspace(): WorkspaceSvg;
Defined in: packages/blockly/core/flyout_button.ts:325
Get the button's workspace.
Returns
The workspace in which to place this button.
dispose()
dispose(): void;
Defined in: packages/blockly/core/flyout_button.ts:330
Dispose of this button.
Returns
void
setCursorSvg()
setCursorSvg(cursorSvg): void;
Defined in: packages/blockly/core/flyout_button.ts:347
Add the cursor SVG to this buttons's SVG group.
Parameters
| Parameter | Type | Description |
|---|---|---|
cursorSvg | SVGElement | The SVG root of the cursor to be added to the button SVG group. |
Returns
void
getSvgRoot()
getSvgRoot(): SVGGElement;
Defined in: packages/blockly/core/flyout_button.ts:400
Returns
SVGGElement
The root SVG element of this rendered element.
Implementation of
getFocusableElement()
getFocusableElement(): HTMLElement | SVGElement;
Defined in: packages/blockly/core/flyout_button.ts:405
See IFocusableNode.getFocusableElement.
Returns
HTMLElement | SVGElement
Implementation of
IFocusableNode.getFocusableElement
getFocusableTree()
getFocusableTree(): IFocusableTree;
Defined in: packages/blockly/core/flyout_button.ts:410
See IFocusableNode.getFocusableTree.
Returns
Implementation of
IFocusableNode.getFocusableTree
onNodeFocus()
onNodeFocus(): void;
Defined in: packages/blockly/core/flyout_button.ts:415
See IFocusableNode.onNodeFocus.
Returns
void
Implementation of
onNodeBlur()
onNodeBlur(): void;
Defined in: packages/blockly/core/flyout_button.ts:422
See IFocusableNode.onNodeBlur.
Returns
void
Implementation of
canBeFocused()
canBeFocused(): boolean;
Defined in: packages/blockly/core/flyout_button.ts:425
See IFocusableNode.canBeFocused.
Returns
boolean
Implementation of
getId()
getId(): string;
Defined in: packages/blockly/core/flyout_button.ts:432
Returns the ID of this FlyoutButton.
Returns
string
performAction()
performAction(): void;
Defined in: packages/blockly/core/flyout_button.ts:442
Handles the user acting on this button via keyboard navigation. Invokes the click handler callback for buttons. For labels, which are not interactive, shows a toast directing the user to navigate using the arrow keys or the next-heading shortcut.
Returns
void