탐색 창 구성요소로 슬라이드 인 메뉴 만들기

탐색 창 구성요소는 사용자가 앱의 다양한 섹션으로 이동할 수 있는 슬라이드 인 메뉴입니다. 사용자는 측면에서 스와이프하거나 메뉴 아이콘을 탭하여 이를 활성화할 수 있습니다.

탐색 창을 구현하기 위한 다음 세 가지 사용 사례를 고려해 보세요.

  • 콘텐츠 구성: 사용자가 뉴스 또는 블로그 앱과 같이 여러 카테고리 간에 전환할 수 있도록 합니다.
  • 계정 관리: 사용자 계정이 있는 앱에서 계정 설정 및 프로필 섹션으로 연결되는 빠른 링크를 제공합니다.
  • 기능 탐색: 단일 메뉴에 여러 기능과 설정을 정리하여 복잡한 앱에서 사용자 탐색 및 액세스를 용이하게 합니다.

Material Design에는 두 가지 유형의 탐색 창이 있습니다.

  • 표준: 화면 내 공간을 다른 콘텐츠와 공유합니다.
  • 모달: 화면 내 다른 콘텐츠 위에 표시됩니다.

버전 호환성

이 구현을 사용하려면 프로젝트 minSDK를 API 수준 21 이상으로 설정해야 합니다.

종속 항목

탐색 창 구현하기

ModalNavigationDrawer 컴포저블을 사용하여 탐색 창을 구현할 수 있습니다.

핵심사항

  • drawerContent 슬롯을 사용하여 ModalDrawerSheet를 제공하고 창의 콘텐츠를 제공합니다.

  • ModalNavigationDrawer는 다양한 추가 창 매개변수를 허용합니다. 예를 들어 다음 예와 같이 gesturesEnabled 매개변수를 사용하여 창이 드래그에 응답하는지 여부를 전환할 수 있습니다.

탐색 창 동작 제어

창이 열리고 닫히는 방식을 제어하려면 DrawerState를 사용하세요.

핵심사항

  • drawerState 매개변수를 사용하여 DrawerState를 ModalNavigationDrawer에 전달합니다.
  • DrawerState를 통해 현재 창 상태와 관련된 속성뿐만 아니라 open 및 close 함수에도 액세스할 수 있습니다. 이러한 정지 함수에는 CoroutineScope가 필요하며 rememberCoroutineScope를 사용하여 인스턴스화할 수 있습니다. UI 이벤트에 대한 응답으로 일시중지 함수를 호출할 수도 있습니다.

결과

그림 1. 표준 탐색 창 (왼쪽)과 모달 탐색 창 (오른쪽)

이 가이드가 포함된 컬렉션

이 가이드는 더 광범위한 Android 개발 목표를 다루는 선별된 빠른 가이드 모음의 일부입니다.

구성 가능한 함수를 사용하여 Material Design 디자인 시스템을 기반으로 멋진 UI 구성요소를 쉽게 만드는 방법을 알아보세요.
빠른 가이드 모음

질문이나 의견이 있으신가요?

자주 묻는 질문(FAQ) 페이지로 이동하여 빠른 가이드를 알아보거나 문의하여 의견을 보내주세요.
FAQ로 이동 의견 남기기