사용자가 블록 또는 작업공간을 마우스 오른쪽 버튼으로 클릭하거나 길게 누르면 추가 작업이 포함된 컨텍스트 메뉴가 표시됩니다. 이 컨텍스트 메뉴를 구성하여 추가 옵션을 표시하거나 기본 옵션을 삭제할 수 있습니다. 이 가이드에서는 모든 블록 또는 모든 작업공간에 맞춤 옵션을 추가하는 방법을 설명합니다. 한 가지 유형의 블록에서만 컨텍스트 메뉴를 변경하려면 맞춤 블록 페이지의 정보를 참고하세요.
컨텍스트 메뉴 API
ContextMenuRegistry 클래스에는 모든 컨텍스트 메뉴 옵션을 등록, 등록 취소, 가져오는 메서드가 포함되어 있습니다. 이 클래스는 싱글톤이므로 새 인스턴스를 직접 인스턴스화하는 대신 Blockly.ContextMenuRegistry.registry 객체에서 메서드를 호출해야 합니다. ContextMenu 클래스는 컨텍스트 메뉴가 표시되어야 할 때마다 getContextMenuItems 메서드를 호출합니다. 블록 또는 작업공간에 customContextMenu 함수가 있으면 나중에 이 함수를 호출하여 옵션 목록을 수정합니다.
맞춤 옵션 추가
레지스트리의 각 메뉴 옵션에는 여러 속성이 있습니다.
callback: 메뉴 옵션을 클릭하면 호출되는 함수입니다.scopeType: 이 옵션이 표시되어야 하는Blockly.ContextMenuRegistry.ScopeType.BLOCK또는Blockly.ContextMenuRegistry.ScopeType.WORKSPACE중 하나입니다. 작업공간과 블록 모두에 옵션을 표시해야 하는 경우 각 scopeType에 한 번씩 등록해야 합니다.displayText: 문자열, HTML 또는 전자를 반환하는 함수입니다. 메뉴에 표시되는 텍스트를 결정합니다.preconditionFn:enabled,disabled또는hidden중 하나를 반환하여 메뉴 옵션을 렌더링해야 하는지 여부와 그 방법을 결정하는 함수입니다.weight: 옵션의 정렬 순서를 결정하는 숫자입니다. 가중치가 더 높은 옵션은 나중에 컨텍스트 메뉴에 표시됩니다.id: 옵션의 고유 문자열 ID입니다.
각 함수 callback, displayText (함수인 경우), preconditionFn는 클릭되는 정확한 작업공간이나 블록에 대한 정보가 포함된 Scope 객체를 사용하여 호출됩니다. 이렇게 하면 컨텍스트 메뉴 옵션에서 작업공간 또는 블록에 대한 속성을 참조할 수 있습니다. 예를 들어 사용자가 모든 블록을 삭제할 수 있는 컨텍스트 메뉴 옵션은 작업공간에 42개의 블록이 포함된 경우 '42개 블록 삭제'라고 표시됩니다. preconditionFn를 사용하는 경우 메뉴 옵션은 블록의 일부 속성이 true인 경우 enabled, 그렇지 않은 경우 disabled일 수 있습니다.
더 많은 예를 보려면 contextmenu_items.js에서 기본 컨텍스트 메뉴 옵션 등록을 참고하세요.
기본 옵션 변경 또는 삭제
Blockly.ContextMenuRegistry.registry.unregister(id)를 사용하여 모든 옵션을 등록 취소할 수 있습니다. 기본 옵션의 ID는 contextmenu_items.js에 있습니다.
기본 옵션을 변경하려면 ID를 사용하여 getItem를 호출하고 필요에 따라 변경합니다.