コピーペースト システムは、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());