既存のフィールドを拡張する

既存のフィールドを拡張するには、組み込みフィールド（FieldTextInput、FieldColour など）をサブクラス化し、ニーズに合わせてその一部を変更する必要があります。変更できるフィールドには、次のようなものがあります。

組み込みフィールドの動作を必要としないカスタム フィールドを作成する場合は、Field をサブクラス化する必要があります。

一般的な拡張機能

ほとんどのカスタム フィールドは、次の 3 つのタイプのいずれかを拡張します。

  • テキスト入力: フィールドに入力させる場合は、FieldTextInput を拡張する必要があります。
  • 数値: 数値を保存する場合は、FieldNumber を拡張する必要があります。
  • プルダウン: プルダウンを作成するものの、デフォルトの文字列モデルや画像モデルとは異なるモデルを保存する場合は、FieldDropdown を拡張する必要があります。
    • 注意: FieldDropdown を拡張する前に、プルダウン フィールドのカスタマイズ オプションではニーズを満たせないことを確認してください。

状況によっては、別のフィールド タイプを拡張する必要があります。たとえば、FieldLabelSerializable は FieldLabel を拡張します。

サブクラス化

import * as Blockly from 'blockly';

export class MyCustomTextField extends Blockly.FieldTextInput {

  constructor(value, validator, config) {
    super(value, validator, config);
  }
}

フィールドのサブクラスのコンストラクタは、カスタム フィールドのコンストラクタとよく似ています。サブコンストラクタのシグネチャは通常、スーパーコンストラクタのシグネチャと一致する必要があります。

JSON と登録

また、このフィールドを 1 回登録する必要があります。

Blockly.fieldRegistry.register('my_custom_text_field', MyCustomTextField);

JSON 形式で動作するように、クラスで fromJson の実装を提供します。

static fromJson(options) {
  const value = Blockly.utils.parsing.replaceMessageReferences(options.value);
  return new MySubclassName(value);
}

フィールドの登録の詳細については、「カスタム フィールドの作成」の JSON と登録セクションをご覧ください。