Class: Drawer
Defined in: packages/blockly/core/renderers/common/drawer.ts:27
An object that draws a block based on the given rendering information.
Extended by
Properties index
| Property | Description |
|---|---|
| block_ | - |
| info_ | - |
| topLeft_ | - |
| outlinePath_ | - |
| inlinePath_ | - |
| constants_ | - |
Methods index
| Method | Description |
|---|---|
| draw | Draw the block to the workspace. Here "drawing" means setting SVG path elements and moving fields, icons, and connections on the screen. |
| 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. |
| drawOutline_ | Create the outline of the block. This is a single continuous path. |
| 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. |
| drawStatementInput_ | Add steps for a statement input. |
| drawRightSideRow_ | Add steps for the right side of a row that does not have value or statement input connections. |
| drawBottom_ | Add steps for the bottom edge of a block, possibly including a notch for the next connection. |
| drawLeft_ | Add steps for the left side of the block, which may include an output 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. |
| drawInlineInput_ | Add steps for an inline input. |
| 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. |
| updateConnectionHighlights | Updates the path object to reflect which connections on the block are highlighted. |
| drawConnectionHighlightPath | Returns a path to highlight the given connection. |
Constructors
Constructor
new Drawer(block, info): Drawer;
Defined in: packages/blockly/core/renderers/common/drawer.ts:40
Parameters
| Parameter | Type | Description |
|---|---|---|
block | BlockSvg | The block to render. |
info | RenderInfo | An object containing all information needed to render this block. |
Returns
Drawer
Properties
block_
block_: BlockSvg;
Defined in: packages/blockly/core/renderers/common/drawer.ts:28
info_
info_: RenderInfo;
Defined in: packages/blockly/core/renderers/common/drawer.ts:29
topLeft_
topLeft_: Coordinate;
Defined in: packages/blockly/core/renderers/common/drawer.ts:30
outlinePath_
outlinePath_: string = '';
Defined in: packages/blockly/core/renderers/common/drawer.ts:31
inlinePath_
inlinePath_: string = '';
Defined in: packages/blockly/core/renderers/common/drawer.ts:32
constants_
protected constants_: ConstantProvider;
Defined in: packages/blockly/core/renderers/common/drawer.ts:33
Methods
draw()
draw(): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:58
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
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
drawOutline_()
protected drawOutline_(): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:85
Create the outline of the block. This is a single continuous path.
Returns
void
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
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
| Parameter | Type | Description |
|---|---|---|
row | Row | The row to draw the side of. |
Returns
void
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
| Parameter | Type | Description |
|---|---|---|
row | Row | The row that this input belongs to. |
Returns
void
drawStatementInput_()
protected drawStatementInput_(row): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:169
Add steps for a statement input.
Parameters
| Parameter | Type | Description |
|---|---|---|
row | Row | The row that this input belongs to. |
Returns
void
drawRightSideRow_()
protected drawRightSideRow_(row): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:201
Add steps for the right side of a row that does not have value or statement input connections.
Parameters
| Parameter | Type | Description |
|---|---|---|
row | Row | The row to draw the side of. |
Returns
void
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
drawLeft_()
protected drawLeft_(): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:242
Add steps for the left side of the block, which may include an output connection
Returns
void
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
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
| Parameter | Type | Description |
|---|---|---|
fieldInfo | Icon | Field | The rendering information for the field or icon. |
Returns
void
drawInlineInput_()
protected drawInlineInput_(input): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:317
Add steps for an inline input.
Parameters
| Parameter | Type | Description |
|---|---|---|
input | InlineInput | The information about the input to render. |
Returns
void
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
| Parameter | Type | Description |
|---|---|---|
input | InlineInput | The information about the input that the connection is on. |
Returns
void
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
| Parameter | Type | Description |
|---|---|---|
row | Row | The row that the connection is on. |
Returns
void
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
| Parameter | Type | Description |
|---|---|---|
row | Row | The row that the connection is on. |
Returns
void
positionPreviousConnection_()
protected positionPreviousConnection_(): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:398
Position the previous connection on a block.
Returns
void
positionNextConnection_()
protected positionNextConnection_(): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:408
Position the next connection on a block.
Returns
void
positionOutputConnection_()
protected positionOutputConnection_(): void;
Defined in: packages/blockly/core/renderers/common/drawer.ts:420
Position the output connection on a block.
Returns
void
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
drawConnectionHighlightPath()
drawConnectionHighlightPath(measurable): SVGElement | undefined;
Defined in: packages/blockly/core/renderers/common/drawer.ts:454
Returns a path to highlight the given connection.
Parameters
| Parameter | Type |
|---|---|
measurable | Connection |
Returns
SVGElement | undefined