본문으로 건너뛰기

Bar

디스플레이 내 앱 화면의 사이즈나 위치 조정 또는 콘텐츠 조작을 위한 요소입니다.​

Bar.svg

States​

StateValueDescription
VariantLight / DarkApp에서 정한 타입에 따라 전환
DraggingTrue / FalseDrag 가능한 window일 때 'True'로 전환
DisabledTrue / FalseTrue일 경우, handle이 안보이고 drag를 제어할 수 없는 상태
PressedTrue / FalseHandle을 잡고 drag를 시작할 때의 상태

Types​

TypesDescription
App barApp을 이동, 종료를 위한 컴포넌트
Window barApp의 window 사이즈 조정을 위한 컴포넌트
Scroll barApp의 content를 탐색하기 위한 컴포넌트

App bar​

AppBar_Anatomy.png

1. Root : App bar 컴포넌트를 감싸는 최상위 컨테이너 영역
2. Control : Handle과 최소 drag 영역을 감싸는 컨테이너 영역
3. Handle : Drag 할 수 있는 컨트롤 요소

Behaviors​

AppBar_Light.png
AppBar_Dark.png


Window bar​

WindowBar_Anatomy.svg

1. Root : Window bar 컴포넌트를 감싸는 최상위 컨테이너 영역
2. Control : Handle과 최소 drag 영역을 감싸는 컨테이너 영역
3. Handle : Drag 할 수 있는 컨트롤 요소

Behaviors​

WindowBar_Light.svg
WindowBar_Dark.svg


Scroll bar​

ScrollBar_Anatomy.svg

1. Root : Scroll bar 컴포넌트를 감싸는 최상위 컨테이너 영역
2. Control : Handle과 최소 drag 영역을 감싸는 컨테이너 영역
3. Handle : Drag 할 수 있는 컨트롤 요소

Behaviors​

ScrollBar_Light.svg
ScrollBar_Dark.svg