Changing the size of blocks

[mazyar seraj]

Hi,

I changed the text size on blocks and I would like to change the size of the blocks in order to fit with the new text size. Can you help me with this?

Thank you!

This is the code that I used for changing the text size on a block:

Blockly.Blocks.base_map = {
  helpUrl: "",
  init: function () {
    this.setColour(230);
    this.appendValueInput("NUM", "Number")
      .appendField("Map ")
      .setCheck("Number");
    this.appendValueInput("DMAX", "Number")
      .appendField("value to [0-")
      .setCheck("Number");
    this.appendDummyInput().appendField("]");
    this.setInputsInline(true);
    this.setOutput(true);
    this.setTooltip("Re-maps a number from [0-1024] to another.");

 

    this.customRender();
  },

 

  customRender: function() {
    var block = this;
    setTimeout(function() { 
      var svgRoot = block.getSvgRoot();
      if (svgRoot) {
        var texts = svgRoot.getElementsByTagName('text');
        for (var i = 0; i < texts.length; i++) {
          texts[i].style.fontSize = '30px'; 
        }
      }
    }, 1);
  }
};

[Aaron Dodson]

If you want to change the text size on all of the blocks, you can use a minimal custom theme. Before you inject Blockly, add the code:

const theme = Blockly.Theme.defineTheme('yourThemeName', {
    'base': Blockly.Themes.Classic, // Or whatever other built-in theme you want to derive from
    'fontStyle': {size: 30},
});

and then pass that object to the `theme` injection option.