Skip to main content

Class: Drawer

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:27

An object that draws a block based on the given rendering information.

Extends

Properties index

PropertyDescription
block_-
topLeft_-
outlinePath_-
inlinePath_-
constants_-
info_-

Methods index

MethodDescription
recordSizeOnBlock_Save sizing information back to the block Most of the rendering information can be thrown away at the end of the render. Anything that needs to be kept around should be set in this function.
drawTop_Add steps for the top corner of the block, taking into account details such as hats and rounded corners.
drawJaggedEdge_Add steps for the jagged edge of a row on a collapsed block.
drawValueInput_Add steps for an external value input, rendered as a notch in the side of the block.
drawBottom_Add steps for the bottom edge of a block, possibly including a notch for the next connection.
drawInternals_Draw the internals of the block: inline inputs, fields, and icons. These do not depend on the outer path for placement.
layoutField_Push a field or icon's new position to its SVG root.
positionInlineInputConnection_Position the connection on an inline value input, taking into account RTL and the small gap between the parent block and child block which lets the parent block's dark path show through.
positionStatementInputConnection_Position the connection on a statement input, taking into account RTL and the small gap between the parent block and child block which lets the parent block's dark path show through.
positionExternalValueConnection_Position the connection on an external value input, taking into account RTL and the small gap between the parent block and child block which lets the parent block's dark path show through.
positionPreviousConnection_Position the previous connection on a block.
positionNextConnection_Position the next connection on a block.
positionOutputConnection_Position the output connection on a block.
updateConnectionHighlightsUpdates the path object to reflect which connections on the block are highlighted.
drawDraw the block to the workspace. Here "drawing" means setting SVG path elements and moving fields, icons, and connections on the screen.
drawOutline_Create the outline of the block. This is a single continuous path.
drawLeft_Add steps for the left side of the block, which may include an output connection
drawRightSideRow_Add steps for the right side of a row that does not have value or statement input connections.
drawRightDynamicConnection_Add steps to draw the right side of an output with a dynamic connection.
drawLeftDynamicConnection_Add steps to draw the left side of an output with a dynamic connection.
drawFlatTop_Add steps to draw a flat top row.
drawFlatBottom_Add steps to draw a flat bottom row.
drawInlineInput_Add steps for an inline input.
drawStatementInput_Add steps for a statement input.
drawConnectionHighlightPathReturns a path to highlight the given connection.

Constructors

Constructor

new Drawer(block, info): Drawer;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:36

Parameters

ParameterTypeDescription
blockBlockSvgThe block to render.
infoRenderInfoAn object containing all information needed to render this block.

Returns

Drawer

Overrides

Drawer.constructor

Properties

block_

block_: BlockSvg;

Defined in: packages/blockly/core/renderers/common/drawer.ts:28

Inherited from

Drawer.block_


topLeft_

topLeft_: Coordinate;

Defined in: packages/blockly/core/renderers/common/drawer.ts:30

Inherited from

Drawer.topLeft_


outlinePath_

outlinePath_: string = '';

Defined in: packages/blockly/core/renderers/common/drawer.ts:31

Inherited from

Drawer.outlinePath_


inlinePath_

inlinePath_: string = '';

Defined in: packages/blockly/core/renderers/common/drawer.ts:32

Inherited from

Drawer.inlinePath_


constants_

protected constants_: ConstantProvider;

Defined in: packages/blockly/core/renderers/common/drawer.ts:33

Inherited from

Drawer.constants_


info_

info_: RenderInfo;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:29

Overrides

Drawer.info_

Methods

recordSizeOnBlock_()

protected recordSizeOnBlock_(): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:76

Save sizing information back to the block Most of the rendering information can be thrown away at the end of the render. Anything that needs to be kept around should be set in this function.

Returns

void

Inherited from

Drawer.recordSizeOnBlock_


drawTop_()

protected drawTop_(): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:107

Add steps for the top corner of the block, taking into account details such as hats and rounded corners.

Returns

void

Inherited from

Drawer.drawTop_


drawJaggedEdge_()

protected drawJaggedEdge_(row): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:138

Add steps for the jagged edge of a row on a collapsed block.

Parameters

ParameterTypeDescription
rowRowThe row to draw the side of.

Returns

void

Inherited from

Drawer.drawJaggedEdge_


drawValueInput_()

protected drawValueInput_(row): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:150

Add steps for an external value input, rendered as a notch in the side of the block.

Parameters

ParameterTypeDescription
rowRowThe row that this input belongs to.

Returns

void

Inherited from

Drawer.drawValueInput_


drawBottom_()

protected drawBottom_(): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:209

Add steps for the bottom edge of a block, possibly including a notch for the next connection.

Returns

void

Inherited from

Drawer.drawBottom_


drawInternals_()

protected drawInternals_(): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:265

Draw the internals of the block: inline inputs, fields, and icons. These do not depend on the outer path for placement.

Returns

void

Inherited from

Drawer.drawInternals_


layoutField_()

protected layoutField_(fieldInfo): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:282

Push a field or icon's new position to its SVG root.

Parameters

ParameterTypeDescription
fieldInfo| Icon | FieldThe rendering information for the field or icon.

Returns

void

Inherited from

Drawer.layoutField_


positionInlineInputConnection_()

protected positionInlineInputConnection_(input): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:345

Position the connection on an inline value input, taking into account RTL and the small gap between the parent block and child block which lets the parent block's dark path show through.

Parameters

ParameterTypeDescription
inputInlineInputThe information about the input that the connection is on.

Returns

void

Inherited from

Drawer.positionInlineInputConnection_


positionStatementInputConnection_()

protected positionStatementInputConnection_(row): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:368

Position the connection on a statement input, taking into account RTL and the small gap between the parent block and child block which lets the parent block's dark path show through.

Parameters

ParameterTypeDescription
rowRowThe row that the connection is on.

Returns

void

Inherited from

Drawer.positionStatementInputConnection_


positionExternalValueConnection_()

protected positionExternalValueConnection_(row): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:386

Position the connection on an external value input, taking into account RTL and the small gap between the parent block and child block which lets the parent block's dark path show through.

Parameters

ParameterTypeDescription
rowRowThe row that the connection is on.

Returns

void

Inherited from

Drawer.positionExternalValueConnection_


positionPreviousConnection_()

protected positionPreviousConnection_(): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:398

Position the previous connection on a block.

Returns

void

Inherited from

Drawer.positionPreviousConnection_


positionNextConnection_()

protected positionNextConnection_(): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:408

Position the next connection on a block.

Returns

void

Inherited from

Drawer.positionNextConnection_


positionOutputConnection_()

protected positionOutputConnection_(): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:420

Position the output connection on a block.

Returns

void

Inherited from

Drawer.positionOutputConnection_


updateConnectionHighlights()

protected updateConnectionHighlights(): void;

Defined in: packages/blockly/core/renderers/common/drawer.ts:436

Updates the path object to reflect which connections on the block are highlighted.

Returns

void

Inherited from

Drawer.updateConnectionHighlights


draw()

draw(): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:40

Draw the block to the workspace. Here "drawing" means setting SVG path elements and moving fields, icons, and connections on the screen.

The pieces of the paths are pushed into arrays of "steps", which are then joined with spaces and set directly on the block. This guarantees that the steps are separated by spaces for improved readability, but isn't required.

Returns

void

Overrides

Drawer.draw


drawOutline_()

drawOutline_(): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:60

Create the outline of the block. This is a single continuous path.

Returns

void

Overrides

Drawer.drawOutline_


drawLeft_()

drawLeft_(): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:76

Add steps for the left side of the block, which may include an output connection

Returns

void

Overrides

Drawer.drawLeft_


drawRightSideRow_()

protected drawRightSideRow_(row): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:93

Add steps for the right side of a row that does not have value or statement input connections.

Parameters

ParameterTypeDescription
rowRowThe row to draw the side of.

Returns

void

Overrides

Drawer.drawRightSideRow_


drawRightDynamicConnection_()

protected drawRightDynamicConnection_(): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:126

Add steps to draw the right side of an output with a dynamic connection.

Returns

void


drawLeftDynamicConnection_()

protected drawLeftDynamicConnection_(): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:140

Add steps to draw the left side of an output with a dynamic connection.

Returns

void


drawFlatTop_()

protected drawFlatTop_(): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:158

Add steps to draw a flat top row.

Returns

void


drawFlatBottom_()

protected drawFlatBottom_(): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:167

Add steps to draw a flat bottom row.

Returns

void


drawInlineInput_()

drawInlineInput_(input): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:175

Add steps for an inline input.

Parameters

ParameterTypeDescription
inputInlineInputThe information about the input to render.

Returns

void

Overrides

Drawer.drawInlineInput_


drawStatementInput_()

drawStatementInput_(row): void;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:206

Add steps for a statement input.

Parameters

ParameterTypeDescription
rowRowThe row that this input belongs to.

Returns

void

Overrides

Drawer.drawStatementInput_


drawConnectionHighlightPath()

drawConnectionHighlightPath(measurable): SVGElement | undefined;

Defined in: packages/blockly/core/renderers/zelos/drawer.ts:237

Returns a path to highlight the given connection.

Parameters

ParameterType
measurableConnection

Returns

SVGElement | undefined

Overrides

Drawer.drawConnectionHighlightPath