Skip to main content

Interface: IFlyout

Defined in: packages/blockly/core/interfaces/i_flyout.ts:18

Interface for a flyout.

Extends​

Properties index​

PropertyDescription
horizontalLayoutWhether the flyout is laid out horizontally or not.
RTLIs RTL vs LTR.
targetWorkspaceThe target workspace
MARGINMargin around the edges of the blocks in the flyout.
autoCloseDoes the flyout automatically close when a block is created?
CORNER_RADIUSCorner radius of the flyout background.

Methods index​

MethodDescription
createDomCreates the flyout's DOM. Only needs to be called once. The flyout can either exist as its own svg element or be a g element nested inside a separate svg element.
initInitializes the flyout.
disposeDispose of this flyout. Unlink from all DOM elements to prevent memory leaks.
getWidthGet the width of the flyout.
getHeightGet the height of the flyout.
getWorkspaceGet the workspace inside the flyout.
isVisibleIs the flyout visible?
setVisibleSet whether the flyout is visible. A value of true does not necessarily mean that the flyout is shown. It could be hidden because its container is hidden.
setContainerVisibleSet whether this flyout's container is visible.
hideHide and empty the flyout.
showShow and populate the flyout.
getContentsReturns the list of flyout items currently present in the flyout. The show method parses the flyout definition into a list of actual flyout items. This method should return those concrete items, which may be used for e.g. keyboard navigation.
reflowReflow blocks and their mats.
isScrollableReturns true if this flyout may be scrolled with a scrollbar or by dragging.
getXCalculates the x coordinate for the flyout position.
getYCalculates the y coordinate for the flyout position.
positionPosition the flyout.
scrollToStartScroll the flyout to the beginning of its contents.

Properties​

horizontalLayout​

horizontalLayout: boolean;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:20

Whether the flyout is laid out horizontally or not.


RTL​

RTL: boolean;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:23

Is RTL vs LTR.


targetWorkspace​

targetWorkspace: WorkspaceSvg | null;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:26

The target workspace


MARGIN​

readonly MARGIN: number;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:29

Margin around the edges of the blocks in the flyout.


autoClose​

autoClose: boolean;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:32

Does the flyout automatically close when a block is created?


CORNER_RADIUS​

readonly CORNER_RADIUS: number;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:35

Corner radius of the flyout background.

Methods​

createDom()​

createDom(tagName): SVGElement;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:46

Creates the flyout's DOM. Only needs to be called once. The flyout can either exist as its own svg element or be a g element nested inside a separate svg element.

Parameters​

ParameterTypeDescription
tagName| string | Svg<SVGSVGElement> | Svg<SVGGElement>The type of tag to put the flyout in. This should be or .

Returns​

SVGElement

The flyout's SVG group.


init()​

init(targetWorkspace): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:55

Initializes the flyout.

Parameters​

ParameterTypeDescription
targetWorkspaceWorkspaceSvgThe workspace in which to create new blocks.

Returns​

void


dispose()​

dispose(): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:61

Dispose of this flyout. Unlink from all DOM elements to prevent memory leaks.

Returns​

void


getWidth()​

getWidth(): number;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:68

Get the width of the flyout.

Returns​

number

The width of the flyout.


getHeight()​

getHeight(): number;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:75

Get the height of the flyout.

Returns​

number

The height of the flyout.


getWorkspace()​

getWorkspace(): WorkspaceSvg;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:82

Get the workspace inside the flyout.

Returns​

WorkspaceSvg

The workspace inside the flyout.


isVisible()​

isVisible(): boolean;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:89

Is the flyout visible?

Returns​

boolean

True if visible.


setVisible()​

setVisible(visible): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:98

Set whether the flyout is visible. A value of true does not necessarily mean that the flyout is shown. It could be hidden because its container is hidden.

Parameters​

ParameterTypeDescription
visiblebooleanTrue if visible.

Returns​

void


setContainerVisible()​

setContainerVisible(visible): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:105

Set whether this flyout's container is visible.

Parameters​

ParameterTypeDescription
visiblebooleanWhether the container is visible.

Returns​

void


hide()​

hide(): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:108

Hide and empty the flyout.

Returns​

void


show()​

show(flyoutDef): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:117

Show and populate the flyout.

Parameters​

ParameterTypeDescription
flyoutDef| string | FlyoutDefinitionContents to display in the flyout. This is either an array of Nodes, a NodeList, a toolbox definition, or a string with the name of the dynamic category.

Returns​

void


getContents()​

getContents(): FlyoutItem[];

Defined in: packages/blockly/core/interfaces/i_flyout.ts:127

Returns the list of flyout items currently present in the flyout. The show method parses the flyout definition into a list of actual flyout items. This method should return those concrete items, which may be used for e.g. keyboard navigation.

Returns​

FlyoutItem[]

List of flyout items.


reflow()​

reflow(): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:130

Reflow blocks and their mats.

Returns​

void


isScrollable()​

isScrollable(): boolean;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:136

Returns​

boolean

True if this flyout may be scrolled with a scrollbar or by dragging.


getX()​

getX(): number;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:143

Calculates the x coordinate for the flyout position.

Returns​

number

X coordinate.


getY()​

getY(): number;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:150

Calculates the y coordinate for the flyout position.

Returns​

number

Y coordinate.


position()​

position(): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:153

Position the flyout.

Returns​

void


scrollToStart()​

scrollToStart(): void;

Defined in: packages/blockly/core/interfaces/i_flyout.ts:156

Scroll the flyout to the beginning of its contents.

Returns​

void