AppBar 및 ToolBar 추가(HTML)

[ 이 문서는 Windows 런타임 앱을 작성하는 Windows 8.x 및 Windows Phone 8.x 개발자를 대상으로 합니다. Windows 10용으로 개발하는 경우에는 최신 설명서를 참조하세요.]

사용자 컨텍스트(일반적으로 현재 페이지 또는 현재 선택)와 관련된 명령을 표시하려면 AppBar를 사용하세요. AppBar는 사용자가 AppBar에서 줄임표를 탭하면 열린 상태가 되어 아이콘 단추 및 메뉴 항목(사용되는 경우)에 대한 레이블 표시하는 명령 화면을 나타냅니다. AppBarCommand는 "기본" 또는 "보조"일 수 있습니다. 기본 명령은 앱 바의 작업 영역에 단추 명령으로 표시되고 보조 명령은 항상 넘침 영역에서 메뉴 명령으로 숨겨져 있습니다. 앱 바는 응용 프로그램의 맨 위 또는 맨 아래로 제한되며 항상 캔버스를 오버레이합니다.

앱 바의 예

도구 모음은 앱 바의 특수한 형태로서 명령 확장성을 처리하는 간단한 컨트롤입니다. 이 컨트롤에는 명령을 즉시 사용할 수 있는 작업 영역과 명령이 숨겨져 있지만 최종 사용자의 요청 시 표시될 수 있는 넘침 영역이 포함되어 있습니다. 이 컨트롤은 공간이 제한된 경우 명령이 동적으로 기본 영역에서 보조 영역으로 이동할 수 있도록 하여 적응형 동작을 지원합니다. ToolBar는 앱에서 단일 위치로 제한되지 않으며 AppBar,플라이아웃 및 캔버스와 같은 다양한 위치에 있을 수 있습니다.

WinJS 시도(영문) 웹 사이트에서 AppBar, ToolBar 및 기타 주요 WinJS(JavaScript용 Windows 라이브러리) 기능을 사용해 볼 수 있습니다.

여기서 앱 바와 도구 모음은 다음과 같은 점에서만 다르다는 점을 기억해야 합니다.

  • AppBar는 빠른 해제가 가능한 오버레이입니다. 즉, 화면의 일부를 항상 차지하고 있습니다.
  • 다른 모든 빠른 해제가 가능한 오버레이와 마찬가지로 앱 바는 항상 <body> 요소의 직계 자식이어야 합니다.
  • 도구 모음은 닫혀 있는 경우 오버레이가 아닙니다. 즉, 다른 모든 구성 요소와 마찬가지로 고유 레이아웃 공간이 있어야 합니다.
  • 도구 모음이 열려 있는 경우 세로로 확장하면 인접한 콘텐츠를 가려 오버레이와 같이 작동합니다.

이 조항의 내용

항목 설명

명령이 포함된 도구 모음 추가(HTML)

ToolBar 은 명령 확장성을 해결하는 간단한 컨트롤입니다. 도구 모음에는 명령을 즉시 사용할 수 있는 action area과 명령이 숨겨져 있지만 최종 사용자의 요청 시 표시될 수 있는 overflow area이 있습니다. 이 컨트롤은 공간이 제한된 경우 명령이 동적으로 기본 영역에서 보조 영역으로 이동할 수 있도록 하여 적응형 동작을 지원합니다. ToolBar은 앱에서 단일 위치로 제한되지 않으며 Splitview, Flyoutcanvas와 같은 다양한 위치에 있을 수 있습니다.

명령이 포함된 AppBar 추가(HTML)

이 문서에서는 JavaScript로 작성한 Windows 런타임 앱에 AppBar를 추가하는 방법을 설명합니다.

사용자 지정 콘텐츠가 포함된 AppBar 추가(HTML)

JavaScript로 작성한 Windows 스토어 앱에 사용자 지정 콘텐츠가 포함된 AppBar를 추가할 수 있습니다.

ListView와 앱 바를 함께 작동시키는 방법

이 방법 항목에서는 AppBar의 모범 사례에 따르면서 이러한 시나리오를 지원하기 위한 ListView와 AppBar 간 조작에 대해 설명합니다.

AppBar 및 ToolBar 스타일 지정(HTML)

AppBar 또는 ToolBar 및 해당 컨트롤의 스타일을 지정하는 방법의 예를 제공합니다.