LabelButton

위치: qml/components/control/buttons/LabelButton.qml

LabelButton는 AbstractButton를 기반으로 만든 텍스트 전용 버튼 변형입니다.

목적

• 컴팩트한 고정 높이 텍스트 작업 버튼을 제공합니다.
• 시각적 노이즈를 줄이면서 기본 버튼의 톤 동작을 유지합니다.

API

AbstractButton와 고정 레이아웃 계약에서 상속됨:

• 고정 높이: Theme.gap20
• horizontalPadding: Theme.gap8
• verticalPadding: Theme.gap4
• cornerRadius: Theme.radiusSm

사용법

import LVRS 1.0 as LV

LV.LabelButton {
    text: "Save"
    tone: LV.AbstractButton.Primary
}

동작 원리

• contentItem를 바디 스타일 라벨로 재정의합니다.
• 레이블 너비와 수평 패딩을 통해 암시적 너비를 동적으로 유지합니다.
• Figma 호환 컴팩트 계약에 잠긴 암시적/명시적 높이를 유지합니다.

실용적인 참고 사항

• 조밀한 도구 모음과 짧은 작업 레이블에는 LabelButton를 사용하세요.
• 아이콘이 많은 작업의 경우 레이블 잘림 압력을 피하기 위해 IconButton를 선호합니다.

FAQ

Q. LabelButton가 더 큰 텍스트에도 고정된 컴팩트 높이를 유지하는 이유는 무엇입니까? A. 이것은 조밀한 도구 모음 리듬을 위해 설계된 것입니다. 긴 라벨은 단축되거나 더 큰 버튼 변형으로 이동되어야 합니다.

Q. 반경/패딩을 변경할 수 있나요? A. 예, 상속된 레이아웃 속성은 재정의 가능하지만 버튼 패밀리 사전 설정과의 시각적 패리티가 깨질 수 있습니다.

실수 패턴

• 장황한 문장 길이의 라벨을 컴팩트한 버튼에 넣는 것,
• 형제 버튼 전체에 사용자 정의 패딩을 혼합하고 행 정렬을 잃습니다.

검증 체크리스트

• 활성화/비활성화 상태에서 톤 대비가 허용됩니다.
• 컴팩트한 레이아웃에서 텍스트가 많이 생략되는 것을 방지할 수 있을 만큼 충분히 짧은 텍스트를 유지합니다.
• 행 일관성을 위해 형제 버튼 높이가 일치합니다.