TextEditor

위치: qml/components/control/input/TextEditor.qml

TextEditor는 선택적으로 렌더링된 미리보기 출력이 가능한 다중 라인 리치/플레인 편집기입니다.

목적

• 고정된 뷰포트 높이에서 안정적인 다중 라인 편집을 제공합니다.
• 모드 기반 텍스트 정규화 및 미리보기 렌더링을 지원합니다.
• 강력한 입력 처리를 위해 중첩 스크롤 및 IME 동작을 분리합니다.

API

모드 상수:

• plainTextMode
• markdownMode
• richTextMode

모드/제어 속성 :

• mode
• enforceModeDefaults
• wrapMode
• textFormat

편집 API :

• text, placeholderText, readOnly
• cursorPosition, selectionStart, selectionEnd
• selectByMouse, persistentSelection, overwriteMode

레이아웃/미리보기:

• fieldMinHeight, editorHeight, resolvedEditorHeight
• showRenderedOutput, outputMinHeight, previewHeight
• showScrollBar, autoFocusOnPress

신호/방법:

• textEdited(text)
• submitted(text)
• forceEditorFocus(), insertText(value), clear(), undo(), redo(), submit()

사용법

import LVRS 1.0 as LV

LV.TextEditor {
    mode: markdownMode
    editorHeight: 240
    showRenderedOutput: true
    onSubmitted: save(text)
}

동작 원리

• 편집은 고정된 외부 높이를 가진 Flickable 내부에서 수행되며, 콘텐츠는 내부에서 성장합니다.
• Ctrl+Enter 또는 Cmd+Enter는 submitted를 방출합니다.
• 미리보기 텍스트는 TextMarkup.renderHtml(text)를 통해 생성됩니다.
• InputMethodGuard와 WheelScrollGuard는 구성 안전 및 스크롤 격리를 위해 내장되어 있습니다.

고급 예시: 제출 바로가기 작업 흐름

import LVRS 1.0 as LV

LV.TextEditor {
    mode: plainTextMode
    onSubmitted: function(text) {
        console.log("submit", text.length)
    }
}

제출은 Ctrl+Enter 또는 Cmd+Enter에 의해 트리거됩니다.

실용적인 참고 사항

• 사용자가 즉시 렌더링된 피드백이 필요할 때만 미리보기를 활성화 상태로 유지하십시오.
• 대용량 문서의 경우 스크롤 동작을 모니터링하고 부모 컨테이너가 휠 이벤트를 캡처하지 않도록 하십시오.

레시피: 마크다운 미리보기 토글

import LVRS 1.0 as LV

Item {
    property bool previewOn: true

    LV.TextEditor {
        mode: markdownMode
        showRenderedOutput: previewOn
    }
}

실패 패턴

대규모 마크다운 미리보기는 레이아웃 작업을 증가시킬 수 있습니다. 매우 큰 문서의 경우, 수동 미리보기 토글 또는 지연 미리보기 업데이트 정책을 제공하십시오.