mirror of
https://github.com/google/blockly.git
synced 2026-01-10 02:17:09 +01:00
Adaptive popup size for FieldDropdowns (#1897)
Replace the fixed dropdown height with one responsive to the document's viewport. This is adapted from Bohdan-Tereta's proposed solution: https://github.com/google/blockly/pull/1483#issuecomment-381638639 It is sub-optimal, in that is does not adapt to field height (variable due to workspace zoom), and it does not fully utilize the space above or below the field if the block is near the top or the bottom.
This commit is contained in:
committed by
GitHub
parent
15817e78a1
commit
e9aae34388
@@ -567,9 +567,6 @@ Blockly.Css.CONTENT = [
|
||||
|
||||
'.blocklyDropdownMenu {',
|
||||
'padding: 0 !important;',
|
||||
/* max-height value is same as the constant
|
||||
* Blockly.FieldDropdown.MAX_MENU_HEIGHT defined in field_dropdown.js. */
|
||||
'max-height: 300px !important;',
|
||||
'}',
|
||||
|
||||
/* Override the default Closure URL. */
|
||||
|
||||
@@ -84,10 +84,9 @@ Blockly.FieldDropdown.fromJson = function(options) {
|
||||
Blockly.FieldDropdown.CHECKMARK_OVERHANG = 25;
|
||||
|
||||
/**
|
||||
* Maximum height of the dropdown menu,it's also referenced in css.js as
|
||||
* part of .blocklyDropdownMenu.
|
||||
* Maximum height of the dropdown menu, as a percentage of the viewport height.
|
||||
*/
|
||||
Blockly.FieldDropdown.MAX_MENU_HEIGHT = 300;
|
||||
Blockly.FieldDropdown.MAX_MENU_HEIGHT_VH = 0.45;
|
||||
|
||||
/**
|
||||
* Android can't (in 2014) display "▾", so use "▼" instead.
|
||||
@@ -258,8 +257,10 @@ Blockly.FieldDropdown.prototype.positionMenu_ = function(menu) {
|
||||
this.createWidget_(menu);
|
||||
var menuSize = Blockly.utils.uiMenu.getSize(menu);
|
||||
|
||||
if (menuSize.height > Blockly.FieldDropdown.MAX_MENU_HEIGHT) {
|
||||
menuSize.height = Blockly.FieldDropdown.MAX_MENU_HEIGHT;
|
||||
var menuMaxHeightPx = Blockly.FieldDropdown.MAX_MENU_HEIGHT_VH
|
||||
* document.documentElement.clientHeight;
|
||||
if (menuSize.height > menuMaxHeightPx) {
|
||||
menuSize.height = menuMaxHeightPx;
|
||||
}
|
||||
|
||||
if (this.sourceBlock_.RTL) {
|
||||
|
||||
Reference in New Issue
Block a user