Wenn ein Nutzer mit der rechten Maustaste auf einen Block oder Arbeitsbereich klickt oder lange drückt, wird ein Kontextmenü mit zusätzlichen Aktionen angezeigt. Sie können dieses Kontextmenü so konfigurieren, dass zusätzliche Optionen angezeigt oder die Standardoptionen entfernt werden. In dieser Anleitung erfahren Sie, wie Sie allen Blöcken oder Arbeitsbereichen eine benutzerdefinierte Option hinzufügen. Wenn Sie das Kontextmenü für nur einen Blocktyp ändern möchten, lesen Sie die Informationen auf der Seite mit benutzerdefinierten Blöcken.
Kontextmenü-API
Die ContextMenuRegistry
-Klasse enthält Methoden zum Registrieren, Aufheben der Registrierung und zum Abrufen aller Kontextmenüoptionen. Die Klasse ist ein Singleton-Objekt. Daher sollten Methoden für das Blockly.ContextMenuRegistry.registry
-Objekt aufgerufen werden, anstatt selbst eine neue Instanz zu instanziieren. Die Klasse ContextMenu
ruft die Methode getContextMenuItems
immer dann auf, wenn ein Kontextmenü angezeigt werden soll. Wenn der Block oder Arbeitsbereich eine customContextMenu
-Funktion hat, wird sie danach aufgerufen, um die Liste der Optionen zu ändern.
Benutzerdefinierte Optionen hinzufügen
Jede Menüoption in der Registry hat mehrere Eigenschaften:
callback
: Eine Funktion, die beim Klicken auf die Menüoption aufgerufen wird.scopeType
: EntwederBlockly.ContextMenuRegistry.ScopeType.BLOCK
oderBlockly.ContextMenuRegistry.ScopeType.WORKSPACE
, für die diese Option angezeigt werden soll. Wenn eine Option sowohl für Arbeitsbereiche als auch für Blöcke angezeigt werden soll, muss sie für jeden Bereichstyp einmal registriert werden.displayText
: Entweder ein String, HTML oder eine Funktion, die einen der beiden Werte zurückgibt. Bestimmt den im Menü angezeigten Text.preconditionFn
: Funktion, die entwederenabled
,disabled
oderhidden
zurückgibt, um zu bestimmen, ob und wie die Menüoption gerendert werden soll.weight
: Eine Zahl, die die Sortierreihenfolge der Option bestimmt. Optionen mit einer höheren Gewichtung werden später im Kontextmenü angezeigt.id
: Eine eindeutige String-ID für die Option.
Alle Funktionen callback
, displayText
(falls eine Funktion) und preconditionFn
werden mit einem Scope
-Objekt aufgerufen, das Informationen zum genauen Arbeitsbereich oder Block enthält, auf den geklickt wird. So kann die Kontextmenüoption auf Eigenschaften zum Arbeitsbereich oder Block verweisen. So lautet beispielsweise die Option „42 Blöcke löschen“ im Kontextmenü, die es einem Nutzer ermöglicht, alle Blöcke zu löschen, wenn der Arbeitsbereich 42 Blöcke enthält. Mit dem preconditionFn
kann eine Menüoption enabled
sein, wenn ein Attribut des Blocks wahr ist, oder disabled
.
Weitere Beispiele finden Sie in contextmenu_items.js, um die Registrierung der Standardkontextmenüoptionen zu sehen.
Standardoptionen ändern oder entfernen
Sie können die Registrierung jeder Option mit Blockly.ContextMenuRegistry.registry.unregister(id)
aufheben. Die IDs für die Standardoptionen befinden sich in contextmenu_items.js.
Um eine Standardoption zu ändern, rufen Sie getItem
mit der ID auf und ändern Sie sie nach Bedarf.