App Bar Usage

화면 최상단에 위치한 App Bar는 현재 페이지 이름을 보여주어 사용자가 앱 어디에 위치해 있는지 파악할 수 있도록 돕습니다.

Layout

Placement

네비게이션을 제외한 화면 영역의 최상단에 위치합니다.

모바일 환경에서는 화면 최상단 섹션인 상태 표시줄 바로 아래에 배치합니다. 배치 위치는 변경될 수 없습니다.

Content

Page Name and Navigation

App bar에서는 현재 페이지 이름을 표기하여 사용자가 언제든 현재 위치를 파악할 수 있도록 돕습니다. 하위 페이지에서는 뒤로 가기 버튼을 배치하여 상위 페이지로 빠져나갈 수 있는 장치를 제공합니다.

✓DoRequired

페이지 이름은 왼쪽 정렬합니다.

✕Don'tRequired

페이지 이름을 가운데 또는 우측 정렬하지 않습니다.

✓DoRequired

하위 페이지의 뒤로가기 버튼은 페이지 이름 왼쪽에 배치합니다.

✕Don'tRequired

하위 페이지에서 뒤로가기 버튼을 누락하지 않습니다.

Additional Controls

화면 전역에 영향을 주는 액션 장치는 app bar 우측에 배치합니다.

모바일의 경우 우선순위가 높은 핵심 액션 장치만을 최소한의 개수로 배치합니다.

Behaviors

Scroll

스크롤 발생 시 content 영역을 app bar 아래에 배치합니다.