mirror of
https://github.com/scratchfoundation/scratch-blocks.git
synced 2025-08-28 22:10:31 -04:00
Draw squares for non-droppable dropdown fields (#551)
This commit is contained in:
parent
6006f24801
commit
b4826b4065
4 changed files with 32 additions and 8 deletions
|
@ -332,6 +332,12 @@ Blockly.BlockSvg.FIELD_WIDTH = 6 * Blockly.BlockSvg.GRID_UNIT;
|
|||
*/
|
||||
Blockly.BlockSvg.EDITABLE_FIELD_PADDING = 6;
|
||||
|
||||
/**
|
||||
* Square box field padding (left/right of the text).
|
||||
* @const
|
||||
*/
|
||||
Blockly.BlockSvg.BOX_FIELD_PADDING = 3 * Blockly.BlockSvg.GRID_UNIT;
|
||||
|
||||
/**
|
||||
* Minimum width of user inputs during editing
|
||||
* @const
|
||||
|
|
|
@ -392,8 +392,7 @@ Blockly.Css.CONTENT = [
|
|||
|
||||
'.blocklyNonEditableText>rect,',
|
||||
'.blocklyEditableText>rect {',
|
||||
'fill: #fff;',
|
||||
'fill-opacity: .6;',
|
||||
'fill-opacity: 0;',
|
||||
'}',
|
||||
|
||||
'.blocklyNonEditableText>text,',
|
||||
|
@ -401,11 +400,6 @@ Blockly.Css.CONTENT = [
|
|||
'fill: $colour_text;',
|
||||
'}',
|
||||
|
||||
'.blocklyEditableText:hover>rect {',
|
||||
'stroke: #fff;',
|
||||
'stroke-width: 2;',
|
||||
'}',
|
||||
|
||||
'.blocklyDropdownText {',
|
||||
'fill: #fff !important;',
|
||||
'}',
|
||||
|
|
|
@ -307,6 +307,10 @@ Blockly.Field.prototype.render_ = function() {
|
|||
// Add padding to left and right of text.
|
||||
width += Blockly.BlockSvg.EDITABLE_FIELD_PADDING;
|
||||
}
|
||||
if (this.box_) {
|
||||
// Add padding to any drawn box.
|
||||
width += Blockly.BlockSvg.BOX_FIELD_PADDING;
|
||||
}
|
||||
// Update text centering, based on newly calculated width.
|
||||
var centerTextX = width / 2;
|
||||
// In a text-editing shadow block's field,
|
||||
|
@ -332,6 +336,11 @@ Blockly.Field.prototype.render_ = function() {
|
|||
var width = 0;
|
||||
}
|
||||
this.size_.width = width;
|
||||
// Update any drawn box to the correct width and height.
|
||||
if (this.box_) {
|
||||
this.box_.setAttribute('width', this.size_.width);
|
||||
this.box_.setAttribute('height', this.size_.height);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
|
@ -91,6 +91,18 @@ Blockly.FieldDropdown.prototype.init = function() {
|
|||
' ' + Blockly.FieldDropdown.ARROW_CHAR));
|
||||
|
||||
Blockly.FieldDropdown.superClass_.init.call(this);
|
||||
// If not in a shadow block, draw a box.
|
||||
if (!this.sourceBlock_.isShadow()) {
|
||||
this.box_ = Blockly.createSvgElement('rect', {
|
||||
'rx': Blockly.BlockSvg.CORNER_RADIUS,
|
||||
'ry': Blockly.BlockSvg.CORNER_RADIUS,
|
||||
'x': 0,
|
||||
'y': 0,
|
||||
'width': this.size_.width,
|
||||
'height': this.size_.height,
|
||||
'stroke': this.sourceBlock_.getColourTertiary()
|
||||
}, this.fieldGroup_);
|
||||
}
|
||||
// Force a reset of the text to add the arrow.
|
||||
var text = this.text_;
|
||||
this.text_ = null;
|
||||
|
@ -165,7 +177,10 @@ Blockly.FieldDropdown.prototype.showEditor_ = function() {
|
|||
// Recalculate height for the total content, not only box height.
|
||||
menuSize.height = menuDom.scrollHeight;
|
||||
|
||||
Blockly.DropDownDiv.setColour(this.sourceBlock_.parentBlock_.getColour(), this.sourceBlock_.getColourTertiary());
|
||||
var primaryColour = (this.sourceBlock_.isShadow()) ?
|
||||
this.sourceBlock_.parentBlock_.getColour() : this.sourceBlock_.getColour();
|
||||
|
||||
Blockly.DropDownDiv.setColour(primaryColour, this.sourceBlock_.getColourTertiary());
|
||||
Blockly.DropDownDiv.showPositionedByBlock(this, this.sourceBlock_);
|
||||
|
||||
menu.setAllowAutoFocus(true);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue