Bottom_sheet_선택 - boostcampwm-2024/and04-Nature-Album GitHub Wiki

Material Design3에서 제공하는 BottomSheet은 Standard와 Modal로 나뉜다.

BottomSheet을 구현하기 위해서는 ModalBottomSheet을 사용하라고 하는데 Standard와는 어떻게 다른지 비교해보자

Standard Bottom Sheet

BottomSheetScaffold 를 사용한다.

기존 Scaffold에서 BottomBar가 사라지고 sheetContent를 파라미터로 받는 컴포저블로 Collapsed, Expanded 두가지 상태만을 가진다.

Collapsed 상태일때 sheetPeekHeight 값에 따라 보여지는 크기가 결정되고, Sheet 뒤의 content와 상호작용이 가능한다.

중간만 펼치는 기능이 없어 지도와 사진을 동시에 보여주기에 어려움이 있다

sheetPeekHeight를 조절해 사진을 보여주더라도 사진을 스크롤 하려고 할 때 sheet가 Collapsed상태라 sheet의 content가 아니라 sheet 자체가 스크롤 되며 Expanded로 전환된다.

Scaffold기반이라 커스텀이 제한적일 수 있다. ← 추가 확인 필요

sheetState를 skipPartiallyExpanded를 false로 설정한 ModalBottomSheetState로 설정하면 반만 열린 상태를 추가할 수 있다.

반 혹은 전부가 열린 상태에서 화면 뒤로 가야할 이벤트를 막아 별도의 이벤트 처리가 필요함

숨겨진 상태에서는 핸들 자체가 없어서 BottomSheet의 존재를 사용자가 알 수 없음

⇒ 항목 선택을 위한 Bottom Sheet이 아니라 화면을 나눠서 볼 수 있는 용도로 사용하기에는 알맞지 않음

⇒ 커스텀 하자