Das Kopier- und eingefügte System besteht aus drei Elementen: ICopyable-Objekten, ICopyData, die kopierte Objekte darstellen, und IPaster-Objekten, die Daten wieder in kopierbare Objekte umwandeln können. Jeder ICopyable-Typ benötigt ein verknüpftes IPaster, das diese Daten einfügen kann.
Diese Systeme werden dem Nutzer über Kontextmenüoptionen und Tastenkombinationen angezeigt.
Es gibt nur sehr wenige Fälle, in denen ein benutzerdefiniertes Kopieren oder ein benutzerdefiniertes Einfügen erforderlich ist, z.B. das Mehrfachauswahl-Plug-in oder das Plug-in zum Kopieren und Einfügen von Kreuztabellen, da normalerweise kopierbare Objekte gerendert werden und Sie Blockly keine neuen gerenderten Objekte hinzufügen können. Die einzigen gerenderten Objekte, die in einem Arbeitsbereich vorhanden sein können, sind Blöcke, Blasen und Kommentare im Arbeitsbereich.
Kopierbare Funktion implementieren
Um ein kopierbares Objekt zu erstellen, musst du die ICopyable-Schnittstelle implementieren.
Auswählbar
Die Schnittstelle ICopyable erweitert die Schnittstelle ISelectable. Das bedeutet, dass Sie auch diese Methoden und Attribute implementieren müssen.
Es muss ausgewählt werden können, da bei Tastenkombinationen das ausgewählte Objekt berücksichtigt wird, um herauszufinden, was kopiert werden soll.
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.
}
}
Kopierbar
Die Schnittstelle ICopyable selbst hat nur eine Methode, toCopyData, die eine JSON-serialisierbare Darstellung des Status des kopierbaren Objekts zurückgibt, mit der das kopierbare Objekt neu erstellt werden kann.
Die Kopierdaten müssen auch die Property paster enthalten, die den registrierten Stringnamen enthält, der mit dem Nutzer verknüpft ist, in den die kopierten Daten eingefügt werden sollen. Weitere Informationen finden Sie unter Paster implementieren.
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,
};
}
}
Paster implementieren
Um einen Pasteer zu erstellen, müssen Sie die IPaster-Schnittstelle implementieren. Es gibt nur eine Methode paste, die die Kopierdaten des eingefügten Objekts, den Arbeitsbereich, in den das Objekt eingefügt wird, und eine optionale Koordinate annimmt. Das ist der Ort, an dem das Objekt eingefügt werden soll.
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.
}
}
Anmeldung
Nachdem Sie einen Pasteer implementiert haben, müssen Sie ihn registrieren, damit Sie ihn finden können, der mit einer bestimmten Kopie aus seiner paster-Property verknüpft ist.
// This string matches the string assigned to the 'paster' property.
Blockly.clipboard.registry.register('MY_PASTER', new MyPaster());