CodingPirates/blockly
1
0
Fork 0
mirror of https://github.com/google/blockly.git synced 2026-01-08 01:20:12 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2805 from rachel-fenichel/debug/bounding_box

Browse Source 
Add debug rendering that shows the bounding box of the block
This commit is contained in:
Rachel Fenichel
2019-08-12 17:46:34 -07:00
committed by GitHub
parent 70ab436876 61d03ba249
commit 62a62abfaa
3 changed files with 37 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
core/renderers/block_rendering_rewrite/block_render_draw_debug.js
View File

@@ -210,6 +210,27 @@ Blockly.blockRendering.Debug.prototype.drawRowWithElements = function(row, curso
this.drawRenderedRow(row, cursorY, isRtl);
};
/**
* Draw a debug rectangle around the entire block.
* @param {number} width The width of the block.
* @param {number} height The height of the block.
* @param {boolean} isRtl Whether the block is rendered RTL.
* @package
*/
Blockly.blockRendering.Debug.prototype.drawBoundingBox = function(width, height, isRtl) {
var xPos = isRtl ? -width : 0;
var yPos = 0;
this.debugElements_.push(Blockly.utils.dom.createSvgElement('rect',
{
'class': 'blockBoundingBox blockRenderDebug',
'x': xPos,
'y': yPos,
'width': width,
'height': height,
},
this.svgRoot_));
};
/**
* Do all of the work to draw debug information for the whole block.
* @param {!Blockly.BlockSvg} block The block to draw debug information for.
@@ -240,4 +261,6 @@ Blockly.blockRendering.Debug.prototype.drawDebug = function(block, info) {
if (block.outputConnection) {
this.drawConnection(block.outputConnection);
}
this.drawBoundingBox(info.width, info.height, info.isRtl);
};

7
tests/playground.html
View File

@@ -472,6 +472,13 @@ h1 {
stroke-width: 1px;
}
.blockBoundingBox {
stroke: black;
stroke-dasharray: 5,5;
fill: none;
stroke-width: 1px;
}
</style>
</head>
<body onload="start()">

7
tests/screenshot/playground_new.html
View File

@@ -98,6 +98,13 @@ h1 {
.connectionRenderingDot {
display: none;
}
.blockBoundingBox {
stroke: black;
stroke-dasharray: 5,5;
fill: none;
stroke-width: 1px;
}
</style>
</head>
<body onload="start()">