当用户在列表、撰写中向下滚动时，如何防止模态底部工作表移动

Question

我正在使用ModalBottomSheet，将其打开到一定高度，并在lazyColumn中显示列表，当用户在列表中向下滚动时，有时工作表也会向下滑动。

我希望它打开到一定高度，然后在用户单击拖动手柄中的关闭图标之前不会移动。

var isClosable by remember { mutableStateOf(false) }

val previewSheetState = rememberModalBottomSheetState(
    skipPartiallyExpanded = true,
    confirmValueChange = { sheetValue ->
        sheetValue != SheetValue.Hidden || isClosable
    }
)
ModalBottomSheet(
        onDismissRequest = {
            scope.launch {
                isClosable = true
                onBottomSheetDismiss(false)
                previewSheetState.hide()
            }
        },
        sheetState = previewSheetState,
        modifier = Modifier.fillMaxSize()
            .padding(top = 80.dp),  // Adjust this value as needed,
        dragHandle = {
            Column {
                Row(
                    Modifier
                        .fillMaxWidth()
                        .background(Color.White)
                        .padding(start = 15.dp, top = 5.dp, end = 10.dp),
                    Arrangement.SpaceBetween,
                    Alignment.CenterVertically
                ) {
                    Text(
                        text = "Hello",
                        fontSize = 15.sp,
                        fontWeight = FontWeight.SemiBold
                    )

                    
                    Icon(
                        imageVector = Icons.Default.Close,
                        contentDescription = "Close",
                        tint = Color.Black,
                        modifier = Modifier
                            .size(20.dp)
                            .clickable(
                                interactionSource = remember { MutableInteractionSource() },
                                indication = null
                            ) {
                                scope.launch {
                                    isClosable = true
                                    onBottomSheetDismiss(false)
                                    previewSheetState.hide()
                                }
                            }
                    )
                }
                HorizontalDivider(thickness = 1.dp, modifier = Modifier.fillMaxWidth())
            }
        },
        containerColor = Color.Transparent
    ) {
//Sheet content displayed in LazyColumn
}

Answer 1

当

时，将

ModalBottomSheet

参数设置为

draggable

，可以防止

false

被拖动

例如：

ModalBottomSheetLayout(
    sheetContent = { /* Your sheet content here */ },
    sheetState = rememberModalBottomSheetState(
        initialValue = ModalBottomSheetValue.Expanded,
        confirmStateChange = { /* Confirm state changes here */ }
    ),
    sheetShape = /* Your sheet shape here */,
    sheetBackgroundColor = /* Your sheet background color here */,
    sheetContentColor = /* Your sheet content color here */,
    scrimColor = /* Your scrim color here */,
    draggable = false, // This prevents the sheet from being dragged
    content = { /* Your main content here */ }
)