Create custom inputs

  • Creating a custom input involves subclassing Blockly.inputs.Input or one of its subclasses.

  • Custom inputs can optionally have a connection created using the makeConnection method in the constructor.

  • Custom inputs need to be registered with a string identifier to be used in JSON block definitions.

To create a custom input, you need to subclass Input, or one of its subclasses.

class MyInput extends Blockly.inputs.Input {

  // The constructor should always take in a name and a block to be compatible
  // with JSON block definitions.
  constructor(name, block) {
    super(name, block);
    // etc...
  }
}

Optionally create a connection

If you want your input to have a connection, that should be created in the constructor, by calling the makeConnection method.

constructor(name, block) {
  super(name, block);

  this.connection = this.makeConnection(ConnectionType.INPUT_VALUE);
}

Register the input

To be able to use your custom input in a JSON block definition you need to register it and associate it with a string.

class MyInput extends Blockly.inputs.Input {}

Blockly.registry.register(Blockly.registry.Type.INPUT, 'my_input', MyInput);