blockly > BlockSvg

BlockSvg 클래스

블록의 SVG 표현 클래스입니다. 일반적으로 직접 호출되지 않으며 workspace.newBlock()이 선호됩니다.

서명:

export declare class BlockSvg extends Block implements IBoundedElement, IContextMenu, ICopyable<BlockCopyData>, IDraggable, IDeletable, IFocusableNode 

확장: 블록

구현: IBoundedElement, IContextMenu, ICopyable<BlockCopyData>, IDraggable, IDeletable, IFocusableNode

생성자

생성자 수정자 설명
(constructor)(workspace, prototypeName, opt_id) BlockSvg 클래스의 새 인스턴스를 생성합니다.

속성

속성 수정자 유형 설명
COLLAPSED_WARNING_ID

static

readonly

(선언되지 않음) '접힌 경고' 경고를 제공할 ID입니다. 블록에 속한 경고를 삭제하지 않고 '접힌 경고' 경고를 삭제할 수 있습니다.
customContextMenu? (p1: Array<ContextMenuOption | LegacyContextMenuOption>) => void (선택사항)
분해할 수 있나요? (p1: Workspace) => BlockSvg (선택사항)
height 숫자 이 블록의 높이입니다. 위나 아래의 문 블록은 포함되지 않습니다. 높이는 작업공간 단위입니다.
INLINE

static

readonly

(선언되지 않음) 인라인으로 렌더링할 행을 식별하는 상수입니다. Blockly.inputTypes와 충돌하지 마세요.
mutator MutatorIcon | null 블록의 뮤테이터 아이콘입니다 (있는 경우).
nextConnection RenderedConnection
outputConnection RenderedConnection
previousConnection RenderedConnection
rendered readonly (선언되지 않음) 이 블록이 BlockSVG인가요?
saveConnections? (rootBlock: BlockSvg) => void

(선택사항) 이 블록에 연결된 블록의 기록을 저장하여 이 블록이 리컴포즈 (재구성)된 후 나중에 복원할 수 있는 선택적 메서드입니다. 일반적으로 변형기 플라이아웃의 블록에 연결된 블록을 속성에 기록하므로 이러한 구성요소 블록을 재정렬하면 이 블록이 리컴포즈된 후 이 블록에 연결된 해당 블록이 자동으로 재정렬됩니다.

저장된 연결 정보를 최신 상태로 유지하기 위해 MutatorIcon은 변형 도구 플라이아웃이 열리고 이 블록의 작업 공간에서 변경사항이 발생할 때마다 이 메서드를 호출하는 이벤트 리스너를 정렬합니다.

style BlockStyle
width 숫자 연결된 값 블록을 포함한 이 블록의 너비입니다. 너비는 작업공간 단위입니다.
workspace WorkspaceSvg

메서드

메서드 수정자 설명
addClass(className) 이 블록의 SVG 그룹에 CSS 클래스를 추가합니다.
addIcon(icon)
addSelect() 블록에 '선택' 시각 효과를 추가하지만 실제로 선택하거나 이벤트를 발생시키지는 않습니다.
appendInput(input)
bringToFront(blockOnly) 이 블록을 표시된 작업공간의 맨 앞으로 이동합니다. 태그는 z-index를 따르지 않으므로 SVG는 DOM에 있는 순서대로 렌더링합니다. 블록 그룹의 내에 이 블록을 먼저 배치하면 다른 블록 위에 렌더링됩니다. DOM 노드의 순서를 다시 지정하므로 이 메서드는 비용이 많이 들기 때문에 드물게 사용하세요.
bumpNeighbours()

연결되지 않은 블록을 정렬에서 벗어나게 합니다.

실제로 연결되지 않은 두 블록이 화면에서 우연히 정렬되면 최종 사용자에게 혼란을 줄 수 있으므로 정렬되지 않아야 합니다.

calculateContextMenuLocation(e) protected 이 블록의 컨텍스트 메뉴를 표시할 위치를 가져옵니다. 블록을 클릭한 경우 클릭 위치를 사용하고, 그렇지 않은 경우 블록의 필드를 기반으로 한 위치를 사용합니다.
canBeFocused() IFocusableNode.canBeFocused를 참고하세요.
checkAndDelete() 블록을 삭제하고 채프를 숨깁니다. 블록이 플라이아웃에 있는 경우 삭제되지 않습니다. 이는 컨텍스트 메뉴와 단축키에서 전체 삭제 작업으로 호출됩니다. 작업 영역에서 블록을 삭제하고 플라이아웃 검사를 실행하거나, 이벤트 그룹화를 처리하거나, 채프를 숨길 필요가 없는 경우 block.dispose()를 직접 사용하세요.
dispose(healStack, animate) 이 블록을 처리합니다.
disposeInternal() 상위 블록에서 요구하는 작업을 실행하지 않고 이 블록을 처리합니다. 예: UI 효과를 트리거하고 노드를 삭제합니다.
drag(newLoc, e) 블록을 지정된 위치로 드래그합니다.
endDrag(e) 블록에서 드래그를 종료합니다.
generateContextMenu(e) protected 이 블록의 컨텍스트 메뉴를 생성합니다.
getBoundingRectangle() 이 블록과 그 아래에 쌓인 블록의 크기를 설명하는 경계 상자의 좌표를 반환합니다. 좌표계: 작업공간 좌표
getBoundingRectangleWithoutChildren() 이 블록의 크기를 설명하는 경계 상자의 좌표를 반환합니다. 좌표계: 작업공간 좌표
getChildren(ordered) 이 블록 내에 직접 중첩된 모든 블록을 찾습니다. 값 및 문 입력과 후속 문을 포함합니다. 출력 탭 또는 이전 문의 연결을 제외합니다. 블록은 위치별로 정렬할 수 있습니다(위에서 아래로).
getColour() 블록의 색상을 가져옵니다.
getColourSecondary() 블록의 보조 색상을 가져옵니다.
getColourTertiary() 블록의 3차 색상을 가져옵니다.
getFocusableElement() IFocusableNode.getFocusableElement를 참고하세요.
getFocusableTree() IFocusableNode.getFocusableTree를 참고하세요.
getNextBlock() 이 블록에 직접 연결된 다음 명령문 블록을 반환합니다.
getPreviousBlock() 이전 연결에 연결된 블록을 반환합니다.
getRelativeToSurfaceXY() 작업공간 단위로,이 블록의 왼쪽 상단 모서리의 좌표를 드로잉 표면의 원점 (0,0)을 기준으로 반환합니다. 블록이 작업 공간에 있는 경우 (0, 0)은 작업 공간 좌표계의 원점입니다. 작업공간 규모에 따라 변경되지 않습니다.
getStyle() 이 블록의 스타일을 지정하는 데 사용되는 BlockStyle 객체를 반환합니다.
getSvgRoot() SVG의 루트 노드를 반환합니다. 루트 노드가 없으면 null을 반환합니다.
initSvg() 블록의 SVG 표현을 만들고 초기화합니다. 두 번 이상 호출할 수 있습니다.
isCopyable() 이 블록이 복사 가능한지 여부를 반환합니다.
isMovable() 이 블록이 이동 가능한지 여부를 반환합니다.
jsonInit(json)
markDirty() 이 블록의 모든 입력에 알림을 보내 필드를 더티로 표시합니다. 더티 필드는 다시 렌더링해야 하는 필드입니다.
moveBy(dx, dy, reason) 상대 오프셋으로 블록을 이동합니다.
moveNumberedInputBefore(inputIndex, refIndex) 번호가 매겨진 입력을 이 블록의 다른 위치로 이동합니다.
moveTo(xy, reason) 블록을 위치로 이동합니다.
onNodeBlur() IFocusableNode.onNodeBlur를 참고하세요.
onNodeFocus() IFocusableNode.onNodeFocus를 참고하세요.
removeClass(className) 이 블록의 SVG 그룹에서 CSS 클래스를 삭제합니다.
removeIcon(type)
removeInput(name, opt_quiet) 이 블록에서 입력을 삭제합니다.
removeSelect() 블록에서 '선택' 시각적 효과를 삭제하지만 실제로 선택 해제하거나 이벤트를 발생시키지는 않습니다.
render() 콘텐츠와 설정에 따라 블록을 즉시 배치하고 리플로우합니다.
revertDrag() 블록을 드래그가 시작될 때의 위치로 다시 이동합니다.
scheduleSnapAndBump() 그리드에 스냅한 다음 다음 렌더링이 끝날 때 인접한 블록을 밀어냅니다.
select() 이 블록을 선택합니다. 블록을 시각적으로 강조 표시합니다.
setCollapsed(collapsed) 블록이 접혀 있는지 여부를 설정합니다.
setColour(colour) 블록의 색상을 변경합니다.
setDeletable(deletable) 블록을 삭제할 수 없는 경우 blocklyNotDeletable 클래스 추가 또는 블록을 삭제할 수 있는 경우 클래스 삭제
setDisabledReason(disabled, reason) 차단이 사용 중지될 수 있는 이유를 추가하거나 삭제합니다. 블록을 사용 중지해야 하는 이유가 있으면 블록 자체가 사용 중지된 것으로 간주됩니다. 사용자가 수동으로 사용 중지하거나 차단이 무효화되는 등 여러 독립적인 이유로 동시에 차단이 사용 중지될 수 있습니다.
setDragStrategy(dragStrategy) 이 블록의 드래그 전략을 설정합니다.
setEditable(editable) 이 블록을 수정할 수 있는지 여부를 설정합니다.
setHighlighted(highlighted) 블록이 강조 표시되는지 여부를 설정합니다. 블록 강조 표시는 현재 실행 중인 블록을 시각적으로 표시하는 데 자주 사용됩니다.
setInputsInline(newBoolean) 값 입력이 가로로 정렬되는지 세로로 정렬되는지 설정합니다.
setMovable(movable) 이 블록이 이동 가능한지 여부를 설정합니다.
setMutator(mutator) 이 블록에 뮤테이터 대화상자를 제공합니다.
setNextStatement(newBoolean, opt_check) 다른 블록이 이 블록의 하단에 연결될 수 있는지 설정합니다.
setOutput(newBoolean, opt_check) 이 블록이 값을 반환하는지 여부를 설정합니다.
setPreviousStatement(newBoolean, opt_check) 이 블록이 다른 블록의 하단에 연결될 수 있는지 설정합니다.
setStyle(blockStyleName) 블록의 스타일 및 색상 값을 설정합니다.
setWarningText(text, id) 이 블록의 경고 텍스트를 설정합니다.
snapToGrid() 이 블록을 가장 가까운 그리드 포인트에 스냅합니다.
startDrag(e) 블록에서 드래그를 시작합니다.
toCopyData() 복사를 위해 블록을 인코딩합니다.
toFlyoutInfo() 플라이아웃에 표시할 수 있는 이 블록의 표현을 반환합니다.
translate(x, y) 블록의 SVG 변환 속성에 변환을 설정하여 블록을 변환합니다.
unselect() 이 블록을 선택 해제합니다. 블록의 시각적 강조 표시를 해제합니다.