blockly > 필드

필드 클래스

수정 가능한 필드의 추상 클래스입니다.

Signature:

export declare abstract class Field<T = any> implements IASTNodeLocationSvg, IASTNodeLocationWithBlock, IKeyboardAccessible, IRegistrable, ISerializable

구현: IASTNodeLocationSvg, IASTNodeLocationWithBlock, IKeyboardAccessible, IRegistrable, ISerializable

생성자

생성자 수정자 설명
(생성자)(값, 검사기, 구성) Field 클래스의 새 인스턴스를 구성합니다.

속성

속성 수정자 유형 설명
borderRect_ protected SVGRectElement | null 렌더링된 필드의 SVG 테두리 요소입니다.
clickTarget_ protected 요소 | null 클릭 핸들러가 바인딩된 요소입니다.
constants_ protected ConstantProvider | null 소스 블록의 렌더기와 관련된 상수입니다.
커서 string 편집기를 시작하는 핫스팟 위에 마우스를 가져갈 때의 마우스 커서 스타일입니다.
DEFAULT_VALUE T | null

**Field**에 설정된 기본값을 덮어쓰려면 프로토타입을 직접 업데이트합니다.

예: FieldImage.prototype.DEFAULT_VALUE = null;
수정 가능 boolean 수정 가능한 필드는 일반적으로 수정 가능함을 나타내는 일종의 UI를 표시합니다. serializer에 의해 저장됩니다.
enabled_ protected boolean 수정 가능한 블록에서 편집기를 사용하여 필드 값을 변경할 수 있나요?
fieldGroup_ protected SVGGElement | null 렌더링된 필드의 SVG 그룹 요소입니다.
isDirty_ protected boolean 이 블록을 다시 렌더링해야 하나요?
maxDisplayLength 숫자 생략 부호를 추가하기 전에 표시할 텍스트의 최대 문자 수입니다.
이름이 있나요? string (선택사항) 필드의 이름입니다. 각 블록 내에서 고유합니다. 정적 라벨은 일반적으로 이름이 지정되지 않습니다.
NBSP

static

readonly

 (선언되지 않음) 줄바꿈 없는 공백
직렬 가능 boolean 직렬화 가능한 필드는 serializer에 의해 저장되지만, 직렬화할 수 없는 필드는 저장되지 않습니다. 수정 가능한 필드도 직렬화할 수 있어야 합니다. 이는 SERIALIZABLE이 이전 버전과 호환되기 때문에 기본적으로 그렇지 않습니다.
size_ protected 크기
SKIP_SETUP

static

readonly

 고유한 기호 필드 생성자가 필드 값을 설정하거나 config_를 실행해서는 *안 되는* 경우 신호를 보내는 데 사용되는 값으로, 대신 서브클래스가 이를 하도록 허용해야 합니다.
sourceBlock_ protected 차단 | null 이 필드가 연결된 것을 차단합니다. null로 시작한 후 init에서 설정됩니다.
textContent_ protected 텍스트 | null 렌더링된 필드의 텍스트 콘텐츠 요소입니다.
textElement_ protected SVGTextElement | null 렌더링된 필드의 SVG 텍스트 요소입니다.
validator_ protected FieldValidator<T> | null 사용자가 수정 가능한 필드를 수정할 때 호출되는 유효성 검사 함수
value_ protected T | null
visible_ protected boolean 차단이 접혀 필드가 표시되거나 숨겨지나요?

방법

메서드 수정자 설명
applyColour()

블록의 색상/스타일과 일치하도록 필드를 업데이트합니다.

필드의 색상이 블록의 색상에 따라 달라지는 경우 비추상 서브클래스에서 이것을 구현하는 것이 좋습니다. 상위 블록이나 렌더러가 변경되는 경우와 같이 적절한 시점에 자동으로 호출됩니다.

자세한 내용은 필드 문서를, 예시는 FieldDropdown을 참조하세요.
bindEvents_() protected 필드에 이벤트를 바인딩합니다. 맞춤 입력 처리가 필요한 경우 서브클래스로 재정의할 수 있습니다.
configure_(config) protected 필드에 전달된 구성 맵을 처리합니다.
createBorderRect_() protected 필드 테두리 직사각형 요소를 만듭니다. 서브클래스에서 재정의하면 안 됩니다. 대신 initView 내에서 함수의 결과를 수정하거나 호출할 별도의 함수를 만드세요.
createTextElement_() protected 입력란 텍스트 요소를 만듭니다. 서브클래스에서 재정의하면 안 됩니다. 대신 initView 내에서 함수의 결과를 수정하거나 호출할 별도의 함수를 만드세요.
doClassValidation_(newValue) protected

설정 전에 필드 값의 변경사항을 검증합니다. 서브클래스 구현의 예는 **FieldDropdown** 을 참고하세요.

**참고:** 유효성 검사는 T, null, undefined 중 하나의 옵션을 반환합니다. **Field**의 구현은 undefined를 반환하지 않지만 새 값이 T와 호환되는 경우 서브클래스가 undefined를 반환하는 것은 유효합니다.
doClassValidation_(newValue) protected
doValueInvalid_(_invalidValue) protected 잘못된 값이 입력되었음을 필드에 알리는 데 사용됩니다. 서브클래스로 재정의할 수 있습니다. FieldTextInput을 참조하세요. 기본적으로 노옵스(no-ops)입니다.
doValueUpdate_(newValue) protected 필드의 값을 업데이트하는 데 사용됩니다. 값의 맞춤 저장/외부 항목 업데이트를 실행하기 위해 서브클래스에서 재정의할 수 있습니다.
getAbsoluteXY_() protected 이 필드의 왼쪽 상단 모서리의 절대 좌표를 반환합니다. 원점 (0,0)은 페이지 본문의 왼쪽 상단입니다.
getBorderRect() protected 테두리 직사각형 요소를 가져옵니다.
getClickTarget_() protected 클릭 핸들러를 결합할 요소입니다. 명시적으로 설정하지 않으면 필드의 SVG 루트가 기본값입니다. 수정 가능한 입력란에서 이 요소를 클릭하면 편집기가 열립니다.
getConstants() 렌더기 상수 제공자를 가져옵니다.
getDisplayText_() protected 이 필드에서 블록에 표시할 텍스트를 가져옵니다. 생략 부호 및 기타 형식으로 인해 getText과 다를 수 있습니다.
getFlipRtl() RTL에서 필드를 뒤집어야 하는지 여부를 반환합니다.
getSize()

필드의 높이와 너비를 반환합니다.

*일반적으로* 렌더링이 호출되는 유일한 장소여야 합니다.
getSourceBlock() 이 필드가 연결된 블록을 가져옵니다.
getSvgRoot() 이 수정 가능한 필드의 그룹 요소를 가져옵니다. 크기 측정 및 위치에 사용됩니다.
getText_() protected 이 필드의 반환된 텍스트를 재정의하기 위한 개발자 후크입니다. 이 필드 값의 텍스트 표현이 값의 문자열 변환이 아닌 경우 재정의합니다. 문자열 형변환을 사용하려면 null을 반환합니다.
getText() 이 필드에서 텍스트를 가져옵니다. 단순히 값을 문자열로 캐스팅하는 것과는 다른 동작을 제공하도록 getText_를 재정의합니다.
getTextContent() protected 텍스트 콘텐츠를 가져옵니다.
getTextElement() protected 텍스트 요소를 가져옵니다.
getTooltip() 이 필드의 도움말 텍스트를 반환합니다.
getValidator() 수정 가능한 필드의 유효성 검사 함수를 가져오며, 설정되지 않은 경우 null을 가져옵니다.
getValue() 필드의 현재 값을 가져옵니다.
initModel() 블록에 설치된 필드의 모델을 초기화합니다. 기본적으로 노옵스(no-ops)입니다.
initView() protected 이 필드의 블록 UI를 만듭니다.
isClickable() 이 필드가 ShowEditor_ 함수를 정의하는지 확인합니다.
isClickableInFlyout(autoClosingFlyout) 블록이 플라이아웃 상태일 때 필드를 클릭할 수 있어야 하는지 확인합니다. 기본적으로 간단한 도구 상자와 같이 항상 열려 있는 플리트에서는 필드를 클릭할 수 있지만 카테고리 도구 상자와 같은 자동 닫는 플리트에서는 필드를 클릭할 수 없습니다. 서브클래스에서 이 함수를 재정의하여 동작을 변경할 수 있습니다. 이 작업이 적용되려면 isClickable도 true를 반환해야 합니다.
isCurrentlyEditable() 이 필드를 현재 수정할 수 있는지 확인합니다. 일부 필드는 수정할 수 없습니다 (예: 텍스트 라벨). 다른 필드는 EDITABLE(수정 가능)일 수 있지만 수정할 수 없는 블록에 있거나 현재 사용 중지되어 있을 수 있습니다.
isEnabled() 소스 블록을 수정할 수 있을 때 편집기를 사용하여 이 필드의 값을 변경할 수 있는지 확인합니다.
isFullBlockField() protected

이 필드가 전체 블록을 차지해야 하는지 여부를 정의합니다.

이 함수를 재정의할 때는 주의해야 합니다. 해킹에 의한 동작이므로 예상대로 작동하지 않을 수 있습니다. 이 함수를 재정의하려면 포럼에 원하는 동작을 게시하여 다른 접근 방식이 있는지 확인하세요.
isSerializable() XML 렌더러에서 이 필드를 직렬화해야 하는지 확인하세요. 이전 버전과의 호환성 및 불일치 상태의 로직을 처리합니다.
isTabNavigable() 필드를 탭하여 탐색할 수 있는지 여부를 반환합니다.
isVisible() 이 수정 가능한 필드가 표시되는지 여부를 가져옵니다.
loadLegacyState(callingClass, state) 이전 XML 후크를 사용해야 하는 경우 이러한 후크를 사용하여 지정된 상태를 로드합니다. 로드가 처리되었음을 나타내려면 true를 반환하고 그렇지 않으면 false를 반환합니다.
onLocationChange(_) 필드에 위치가 변경되었음을 알립니다.
onMouseDown_(e) protected 필드에서 포인터 다운 이벤트를 처리합니다.
onShortcut(_shortcut) 지정된 단축키를 처리합니다.
positionBorderRect_() protected 크기가 변경된 후 필드의 테두리 직사각형을 배치합니다.
positionTextElement_(xOffset, contentWidth) protected 크기가 변경된 후 필드의 텍스트 요소를 배치합니다. 이는 LTR과 RTL 위치 지정을 모두 처리합니다.
render_() protected

getSize()에서 DOM 요소의 이동/크기를 조절하고 새 크기를 가져오는 데 사용됩니다.

블록의 크기/모양에 영향을 미치는 모든 렌더링은 여기에서 수행해야 하며 getSize()로 트리거되어야 합니다.
repositionForWindowResize()

창 크기 조절 중에 WidgetDiv의 위치를 변경하는 개발자 후크입니다. 창의 크기를 조절할 때 자체적으로 위치를 변경해야 하는 WidgetDiv가 필드에 있는 경우 이 후크를 정의해야 합니다. 예를 들어 텍스트 입력 필드는 이 후크를 정의하여 입력 WidgetDiv가 창 크기 조절 이벤트에서 자체적으로 재배치될 수 있도록 합니다. 이는 모달 입력이 사용 중지된 경우 특히 중요합니다. 소프트 키보드가 열리면 Android 기기에서 창 크기 조절 이벤트를 실행하기 때문입니다.

WidgetDiv의 위치를 변경하는 대신 자체를 숨기려면 false를 반환합니다. 이것이 기본 동작입니다.

DropdownDivs는 이미 자체 배치 로직을 처리하므로 필드에 DropdownDiv만 있는 경우 이 함수를 재정의할 필요가 없습니다.
saveLegacyState(callingClass) protected 사용해야 하는 경우 XML 상태의 문자열화된 버전을 반환합니다. 그렇지 않은 경우 null을 반환하여 필드에 자체 직렬화를 사용해야 함을 알립니다.
setEnabled(enabled) 소스 블록을 수정할 수 있을 때 편집기를 사용하여 이 필드의 값을 변경할 수 있는지를 설정합니다.
setSourceBlock(block) 이 입력란을 블록에 첨부합니다.
setTooltip(newTip) 이 필드의 도움말을 설정합니다.
setValidator(handler)

수정 가능한 필드에 새로운 유효성 검사 함수를 설정하거나 이전에 설정된 유효성 검사 도구를 지웁니다.

유효성 검사 함수는 새 필드 값을 가져와 유효성이 검사된 값을 반환합니다. 검증된 값은 입력 값, 입력 값의 수정된 버전 또는 변경을 취소하기 위한 null일 수 있습니다.

함수가 아무것도 반환하지 않거나 정의되지 않은 값을 반환하면 새 값이 유효한 것으로 간주됩니다. 이는 검증된 함수를 필드 수준 변경 이벤트 알림으로 사용하는 필드를 허용하기 위한 조치입니다.
setValue(newValue, fireChangeEvent) 필드의 값을 변경하는 데 사용됩니다. 유효성 검사 및 이벤트를 처리합니다. 서브클래스는 이 메서드 대신 doClassValidation_ 및 doValueUpdate_를 재정의해야 합니다.
showEditor_(_e) protected 필드 편집기를 만들기 위한 개발자 후크입니다. 기본적으로 작동하지 않으며 편집기를 만들려면 재정의해야 합니다.
updateEditable() 이 필드의 수정 가능 여부를 나타내는 UI를 추가하거나 삭제합니다.
updateSize_(margin) protected 텍스트에 따라 필드 크기를 업데이트합니다.