如何使可滑動的可組合只消耗直接在內容上的點擊和拖動？

Question

背景

• 我已經建立了一個帶有三個錨點的自定義底板。
• 有一個用於從BottomSheetState.Gone過渡到BottomSheetState.Half的 FAB。
• 此底部工作表的內容不覆蓋、半覆蓋或完全覆蓋全屏GoogleMap Composable 。
• maxHeight參數是父Composable的全高（以像素為單位）。

@ExperimentalMaterialApi
@Composable
fun AnchoredBottomSheet(
    state: BottomSheetState,
    maxHeight: Float,
    content: @Composable () -> Unit,
) {
    val swipeableState = rememberSwipeableState(initialValue = state)

    val anchors = mapOf(
        BottomSheetState.Gone.toAnchor(maxHeight),
        BottomSheetState.Half.toAnchor(maxHeight),
        BottomSheetState.Full.toAnchor(maxHeight),
    )

    Column(
        modifier = Modifier
            .height(maxHeight.dp)
            .swipeable(
                enabled = swipeableState.currentValue != BottomSheetState.Gone,
                state = swipeableState,
                orientation = Orientation.Vertical,
                anchors = anchors,
            )
            .offset {
                IntOffset(
                    0,
                    swipeableState.offset.value.roundToInt()
                )
            }
    ) {
        content()
    }
}

問題

• 當應用程序處於BottomSheetState.Half state 或BottomSheetState.Gone時，
• 用戶點擊屏幕的GoogleMap部分，
• 點擊被AnchoredBottomSheet捕獲，並且不會傳遞給可見的（ GoogleMap ） Composable 。
• 例如，在這張照片中，屏幕的青色部分代表BottomSheetState.Half state 中視圖的GoogleMap部分，它不會收到點擊。

問題

如何使我的底部工作表實現僅消耗底部工作表內容上發生的單擊/拖動？

Answer 1

問題在於Modifier擴展調用的順序。 Modifier.swipeable()應該在Modifier.offset()之后發生。

@ExperimentalMaterialApi
@Composable
fun AnchoredBottomSheet(
    state: BottomSheetState,
    maxHeight: Float,
    content: @Composable () -> Unit,
) {
    val swipeableState = rememberSwipeableState(initialValue = state)

    val anchors = mapOf(
        BottomSheetState.Gone.toAnchor(maxHeight),
        BottomSheetState.Half.toAnchor(maxHeight),
        BottomSheetState.Full.toAnchor(maxHeight),
    )

    Column(
        modifier = Modifier
            .offset {
                IntOffset(
                    x = 0,
                    y = swipeableState.offset.value.roundToInt(),
                )
            }
            .swipeable(
                enabled = swipeableState.currentValue != BottomSheetState.Gone,
                state = swipeableState,
                orientation = Orientation.Vertical,
                anchors = BottomSheetState.getAnchors(maxHeight),
            )
    ) {
        content()
    }
}