コピーと貼り付け

コピーペースト システムは、ICopyable オブジェクト、コピーされたオブジェクトを表す ICopyData、コピーデータをコピー可能なオブジェクトに戻すことができる IPaster オブジェクトという 3 つのオブジェクトで構成されます。どのタイプの ICopyable にも、そのデータを貼り付けられる関連 IPaster が必要です。

これらのシステムは、コンテキスト メニュー オプションキーボード ショートカットを介してユーザーに表示されます。

通常、コピー可能なオブジェクトがレンダリングされ、新たにレンダリングされたオブジェクトを Blockly に追加できないため、カスタムのコピー可能またはカスタム ペースター(複数選択プラグインクロスタブ コピーペースト プラグインなど)の実装が必要になる状況はほとんどありません。ワークスペース内に存在できるレンダリングされたオブジェクトは、ブロック、バブル、ワークスペースのコメントのみです。

コピー可能な

コピー可能なオブジェクトを作成するには、ICopyable インターフェースを実装する必要があります。

選択可能

ICopyable インターフェースは ISelectable インターフェースを拡張するため、これらのメソッドとプロパティも実装する必要があります。

「選択可能」であることが必要です。キーボード ショートカットは、選択されたオブジェクトを参照してコピーする対象を認識するためです。

class MyCopyable implements ISelectable {
  constructor(workspace) {
    this.id = Blockly.utils.idGenerator.genUid();
    this.workspace = workspace;
  }

  select() {
    // Visually indicate this draggable is selected.
  }

  unselect() {
    // Visually indicate this draggable is not selected.
  }
}

コピー可能

ICopyable インターフェース自体には toCopyData というメソッドが 1 つだけあります。このメソッドは、コピー可能なオブジェクトの状態について、シリアル化可能な JSON 表現を返します。これを使用して、コピー可能なオブジェクトの再作成を行うことができます。

コピーデータには、このコピーデータを貼り付けるペースターに関連付けられた登録済み文字列名を保持する paster プロパティも含める必要があります。ペースターの詳細については、ペースターを実装するをご覧ください。

class MyCopyable implements ICopyable {
  constructor(workspace, state) {
    this.workspace = workspace;
    this.myState = state;
  }

  toCopyData() {
    return {
      // This string matches the string used to register the paster.
      paster: 'MY_PASTER',
      state: this.myState,
    };
  }
}

ペースト機能を実装する

ペースターを作成するには、IPaster インターフェースを実装する必要があります。メソッド paste は 1 つだけで、貼り付け対象のコピーデータ、貼り付け先のワークスペース、オプションの座標(貼り付け先の場所)を受け取ります。

class MyPaster implements IPaster {
  paste(copyData, workspace, coordinate) {
    return new MyCopyable(workspace, copyData.state);
    // Optionally position the copyable at the passed coordinate.
    // Optionally select the copyable after it is pasted.
  }
}

登録

パスターを実装したら、そのパスターを登録して、特定のコピーデータに関連付けられたパスターを paster プロパティから見つけられるようにする必要があります。

// This string matches the string assigned to the 'paster' property.
Blockly.clipboard.registry.register('MY_PASTER', new MyPaster());