Blockly. Flyout
Constructor
Flyout
new Flyout(workspaceOptions)
Class for a flyout.
Parameter |
|
---|---|
workspaceOptions |
Dictionary of options for the workspace. Value must not be null. |
Properties
autoClose
boolean
Does the flyout automatically close when a block is created?
- Implements
- Blockly.IFlyout#autoClose
buttons_
non-null Array of non-null Blockly.FlyoutButton
List of visible buttons.
CORNER_RADIUS
number
Corner radius of the flyout background.
- Implements
- Blockly.IFlyout#CORNER_RADIUS
dragAngleRange_
number
Range of a drag angle from a flyout considered "dragging toward workspace". Drags that are within the bounds of this many degrees from the orthogonal line to the flyout edge are considered to be "drags toward the workspace". Example: Flyout Edge Workspace [block] / <-within this angle, drags "toward workspace" | [block] ---- orthogonal to flyout boundary ---- | [block] \ | The angle is given in degrees from the orthogonal.
This is used to know when to create a new block and when to scroll the flyout. Setting it to 360 means that all drags create a new block.
GAP_X
number
Gap between items in horizontal flyouts. Can be overridden with the "sep" element.
GAP_Y
number
Gap between items in vertical flyouts. Can be overridden with the "sep" element.
getClientRect
Return the deletion rectangle for this flyout in viewport coordinates.
- Implements
- Blockly.IDeleteArea#getClientRect
- Returns
-
Blockly.utils.Rect
Rectangle in which to delete.
getMetrics_
Return an object with all the metrics required to size scrollbars for the flyout.
- Returns
-
Blockly.utils.Metrics
Contains size and position metrics of the flyout.
getX
Calculates the x coordinate for the flyout position.
- Implements
- Blockly.IFlyout#getX
- Returns
-
number
X coordinate.
getY
Calculates the y coordinate for the flyout position.
- Implements
- Blockly.IFlyout#getY
- Returns
-
number
Y coordinate.
height_
number
Height of flyout.
horizontalLayout
boolean
Whether the flyout should be laid out horizontally or not.
- Implements
- Blockly.IFlyout#horizontalLayout
isDragTowardWorkspace
Determine if a drag delta is toward the workspace, based on the position and orientation of the flyout. This is used in determineDragIntention_ to determine if a new block should be created or if the flyout should scroll.
Parameter |
|
---|---|
currentDragDeltaXY |
How far the pointer has moved from the position at mouse down, in pixel units. Value must not be null. |
- Implements
- Blockly.IFlyout#isDragTowardWorkspace
- Returns
-
boolean
True if the drag is toward the workspace.
layout_
Lay out the blocks in the flyout.
Parameter |
|
---|---|
contents |
Array of non-null Object The blocks and buttons to lay out. Value must not be null. |
gaps |
Array of number The visible gaps between blocks. Value must not be null. |
MARGIN
number
Margin around the edges of the blocks in the flyout.
- Implements
- Blockly.IFlyout#MARGIN
position
Position the flyout.
- Implements
- Blockly.IFlyout#position
- Returns
-
void
reflowInternal_
Compute height of flyout. Position mat under each block. For RTL: Lay out the blocks right-aligned.
- Returns
-
void
RTL
boolean
Is RTL vs LTR.
- Implements
- Blockly.IFlyout#RTL
scrollbar
non-null Blockly.Scrollbar
SCROLLBAR_PADDING
number
Top/bottom padding between scrollbar and edge of flyout background.
setMetrics_
Sets the translation of the flyout to match the scrollbars.
Parameter |
|
---|---|
xyRatio |
{x:number, y:number} Contains a y property which is a float between 0 and 1 specifying the degree of scrolling and a similar x property. Value must not be null. |
tabWidth_
number
Width of output tab.
targetWorkspace
nullable Blockly.WorkspaceSvg
The target workspace
- Implements
- Blockly.IFlyout#targetWorkspace
targetWorkspace
non-null Blockly.WorkspaceSvg
- Implements
- Blockly.IFlyout#targetWorkspace
toolboxPosition_
number
Position of the toolbox and flyout relative to the workspace.
wheel_
Scroll the flyout.
Parameter |
|
---|---|
e |
Event Mouse wheel scroll event. Value must not be null. |
width_
number
Width of flyout.
workspace_
non-null Blockly.WorkspaceSvg
Methods
addBlockListeners_
addBlockListeners_(root, block, rect)
Add listeners to a block that has been added to the flyout.
Parameter |
|
---|---|
root |
SVGElement The root node of the SVG group the block is in. Value must not be null. |
block |
The block to add listeners for. Value must not be null. |
rect |
SVGElement The invisible rectangle under the block that acts as a mat for that block. Value must not be null. |
clearOldBlocks_
clearOldBlocks_()
Delete blocks, mats and buttons from a previous showing of the flyout.
createBlock
createBlock(originalBlock) returns Blockly.BlockSvg
Create a copy of this block on the workspace.
Parameter |
|
---|---|
originalBlock |
The block to copy from the flyout. Value must not be null. |
- Implements
- Blockly.IFlyout#createBlock
- Throws
-
Error
if something went wrong with deserialization. - Returns
-
non-null Blockly.BlockSvg
The newly created block.
createBlock_
createBlock_(blockXml) returns Blockly.BlockSvg
Create a block from the xml and permanently disable any blocks that were defined as disabled.
Parameter |
|
---|---|
blockXml |
Element The xml of the block. Value must not be null. |
- Returns
-
non-null Blockly.BlockSvg
The block created from the blockXml.
createDom
createDom(tagName) returns SVGElement
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.
Parameter |
|
---|---|
tagName |
(string, non-null Blockly.utils.Svg containing non-null SVGSVGElement, or non-null Blockly.utils.Svg containing non-null SVGGElement) The type of tag to put the flyout in. This should be |
- Implements
- Blockly.IFlyout#createDom
- Returns
-
non-null SVGElement
The flyout's SVG group.
createRect_
createRect_(block, x, y, blockHW, index) returns SVGElement
Create and place a rectangle corresponding to the given block.
Parameter |
|
---|---|
block |
The block to associate the rect to. Value must not be null. |
x |
number The x position of the cursor during this layout pass. |
y |
number The y position of the cursor during this layout pass. |
blockHW |
{height: number, width: number} The height and width of the block. Value must not be null. |
index |
number The index into the mats list where this rect should be placed. |
- Returns
-
non-null SVGElement
Newly created SVG element for the rectangle behind the block.
dispose
dispose()
Dispose of this flyout. Unlink from all DOM elements to prevent memory leaks.
- Implements
- Blockly.IFlyout#dispose
getHeight
getHeight() returns number
Get the height of the flyout.
- Implements
- Blockly.IFlyout#getHeight
- Returns
-
number
The width of the flyout.
getWidth
getWidth() returns number
Get the width of the flyout.
- Implements
- Blockly.IFlyout#getWidth
- Returns
-
number
The width of the flyout.
getWorkspace
getWorkspace() returns Blockly.WorkspaceSvg
Get the workspace inside the flyout.
- Implements
- Blockly.IFlyout#getWorkspace
- Returns
-
non-null Blockly.WorkspaceSvg
The workspace inside the flyout.
hide
hide()
Hide and empty the flyout.
- Implements
- Blockly.IFlyout#hide
init
init(targetWorkspace)
Initializes the flyout.
Parameter |
|
---|---|
targetWorkspace |
The workspace in which to create new blocks. Value must not be null. |
- Implements
- Blockly.IFlyout#init
initFlyoutButton_
initFlyoutButton_(button, x, y)
Initialize the given button: move it to the correct location, add listeners, etc.
Parameter |
|
---|---|
button |
The button to initialize and place. Value must not be null. |
x |
number The x position of the cursor during this layout pass. |
y |
number The y position of the cursor during this layout pass. |
isBlockCreatable_
isBlockCreatable_(block) returns boolean
Does this flyout allow you to create a new instance of the given block? Used for deciding if a block can be "dragged out of" the flyout.
Parameter |
|
---|---|
block |
The block to copy from the flyout. Value must not be null. |
- Returns
-
boolean
True if you can create a new instance of the block, false otherwise.
isScrollable
isScrollable() returns boolean
- Implements
- Blockly.IFlyout#isScrollable
- Returns
-
boolean
True if this flyout may be scrolled with a scrollbar or by dragging.
isVisible
isVisible() returns boolean
Is the flyout visible?
- Implements
- Blockly.IFlyout#isVisible
- Returns
-
boolean
True if visible.
moveRectToBlock_
moveRectToBlock_(rect, block)
Move a rectangle to sit exactly behind a block, taking into account tabs, hats, and any other protrusions we invent.
Parameter |
|
---|---|
rect |
SVGElement The rectangle to move directly behind the block. Value must not be null. |
block |
The block the rectangle should be behind. Value must not be null. |
onBlocklyAction
onBlocklyAction(action) returns boolean
Handles the given action. This is only triggered when keyboard accessibility mode is enabled.
Parameter |
|
---|---|
action |
Blockly.ShortcutRegistry.KeyboardShortcut The action to be handled. Value must not be null. |
- Implements
- Blockly.IBlocklyActionable#onBlocklyAction
- Returns
-
boolean
True if the flyout handled the action, false otherwise.
positionAt_
positionAt_(width, height, x, y)
Update the view based on coordinates calculated in position().
Parameter |
|
---|---|
width |
number The computed width of the flyout's SVG group |
height |
number The computed height of the flyout's SVG group. |
x |
number The computed x origin of the flyout's SVG group. |
y |
number The computed y origin of the flyout's SVG group. |
reflow
reflow()
Reflow blocks and their mats.
- Implements
- Blockly.IFlyout#reflow
setContainerVisible
setContainerVisible(visible)
Set whether this flyout's container is visible.
Parameter |
|
---|---|
visible |
boolean Whether the container is visible. |
- Implements
- Blockly.IFlyout#setContainerVisible
setVisible
setVisible(visible)
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.
Parameter |
|
---|---|
visible |
boolean True if visible. |
- Implements
- Blockly.IFlyout#setVisible
show
show(flyoutDef)
Show and populate the flyout.
Parameter |
|
---|---|
flyoutDef |
(non-null Blockly.utils.toolbox.FlyoutDefinition or string) Contents 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. |
- Implements
- Blockly.IFlyout#show