Compose에서 BottomSheetLayout 쓸 때 Drag 무시하기

BottomSheetLayout을 구현하면 기본적으로 Draggable하다.

 

이 Drag를 막는데는 1가지 확실한 방법과 1가지 애매한 방법이 있다.

 

1. sheetGesturesEnabled

ModalBottomSheetLayout(
    sheetGesturesEnabled = false,

sheetGesturesEnabled 속성을 사용하면 바로 제어가 가능하다.

이걸 사용하면 드래그를 이용해 바텀시트를 내릴 수 없게된다.

 

2. Modifier에서 제스처 강탈(야매)

fun Modifier.verticalScrollDisabled() =
    pointerInput(Unit) {
        awaitPointerEventScope {
            while (true) {
                awaitPointerEvent(pass = PointerEventPass.Initial).changes.forEach {
                    val offset = it.positionChange()
                    if (abs(offset.y) > 0f) {
                        it.consume()
                    }
                }
            }
        }
    }

다른 방법으로는 y offset을 관찰해서 수직 이동이 생기면 해당 동작을 무력화 시키는 방법이다.

Modifier의 확장함수로 선언해서 사용하는 방법으로 이렇게 쓰면 문제가 생기는데, 세로 스크롤에 대한 동작을 막아버리기 때문에, 바텀시트 안에 LazyColumn과 같은 Scrollable 한 컴포저블이 있으면 해당 컴포저블도 스크롤을 할 수 없게 된다.

또 특정 동작을 막는 게 아니라 y offset을 감지하는 방식이라 어떤 예기치 못한 결과를 가져올지 모른다. 당장의 이슈트래커 댓글만 봐도 이 방법을 사용하면 drawer의 모든 요소가 clickable 하지 않게 됐다고 하는 사람이 나왔다...

https://issuetracker.google.com/issues/242384339?pli=1

Google Issue Tracker

번외: setCancelable은 어떻게 구현하는 지?

sheetState = rememberModalBottomSheetState(initialValue = ModalBottomSheetValue.Expanded,
    confirmValueChange = { false })

sheetState 속성에 confirmValueChange를 사용하면 간단히 구현할 수 있다.

 

 

도움이 됐다면 댓글이나 공감 버튼 한 번씩 누르고 가주세요! 로그인 안해도 됩니다 ^_^