MenuItem

위치: /Users/ymy/Developer/LVRS/qml/components/navigation/MenuItem.qml

MenuItem는 아이콘, 레이블, 바로 가기, 상태 스타일링 및 체브론 방향 제어를 포함한 컨텍스트 메뉴 행 컴포넌트입니다.

목적

• 콤팩트한 간격으로 컨텍스트 메뉴 액션 행을 하나 렌더링합니다.
• 아이콘/텍스트 바인딩 및 키/바로 가기 바인딩을 지원합니다.
• 간단한 입력 API를 통해 하위 메뉴 선택 방향을 노출합니다.

API

상태:

• defaultState
• selectedState
• inactiveState
• state

내용:

• label
• key / shortcut
• iconName
• iconSource

체브론:

• showChevron
• selectionDirection (right|left|up|down 문자열 또는 숫자 열거형을 지원합니다)
• 방향 열거 상수:
  • directionRight
  • directionLeft
  • directionUp
  • directionDown

레이아웃:

• itemWidth(기본값: 161)
• itemHeight(기본값: 22)
• iconSize(기본값: 16)
• chevronSize(기본값: 16)

사용법

import LVRS 1.0 as LV

LV.MenuItem {
    iconName: "projectStructure"
    label: "Open Recent"
    key: "Cmd+O"
    showChevron: true
    selectionDirection: "right"
    state: defaultState
}

동작 원리

• 배경은 state에서 해결되었습니다:
  • 기본값: 투명
  • 선택됨: Theme.contextMenuItemSelectedBackground
  • 비활성: Theme.panelBackground08
• 아이콘 소스 해상도 순서:
  1. iconSource
  2. iconName 를 통해 Theme.iconPath(...)
  3. 자리 표시자 블록
• 쉐브론 경로는 Canvas에 그려져 있으며, 해결된 방향으로 회전합니다.

실용적인 참고 사항

• selectionDirection를 사용하여 런타임 데이터에서 서브메뉴 오프닝 사이드를 바인딩하십시오.
• 메뉴 리듬을 보존하기 위해 라벨/키 문자열을 간결하게 유지하십시오.
• 행이 최종 작업(하위 메뉴 없음)인 경우, showChevron: false를 설정하십시오.

검증 체크리스트

• 행 크기가 161x22 계약과 일치합니다.
• 선택된 색상과 비활성 색상이 올바르게 렌더링됩니다.
• 시보레 방향은 selectionDirection를 따릅니다,
• 아이콘 및 텍스트 바인딩을 수동으로 새로 고치지 않고 업데이트합니다.