androidandroid-jetpack-composebottom-sheetandroid-bottomnav

BottomSheetScaffold doesn't stick to the top of BottomNavigation when expanded


I am trying to use BottomSheetScaffold but for some weird reason when I use it on a screen with bottom navigation and expand the bottomSheet the bottom side of it moves a little bit to the top, but when I remove the bottom navigation everything works as expected!

Does anyone have an idea why that is happening? and how can I fix it?

@Composable
fun ContainerView() {
    val scaffoldState = rememberBottomSheetScaffoldState()

    val appBarHeight = getAppBarHeight(
        scaffoldState.bottomSheetState.offset.value,
        scaffoldState.bottomSheetState.targetValue
    )
    Box(modifier = Modifier.fillMaxSize()) {
        BottomSheetScaffold(
            sheetContent = {
                BottomSheetContent(
                    appBarHeight = appBarHeight
                )
            },
            scaffoldState = scaffoldState,
            sheetPeekHeight = 100.dp,
            sheetBackgroundColor = greysWhite,
            sheetShape = Shapes.extraLarge
                .copy(bottomEnd = CornerSize(0), bottomStart = CornerSize(0))
        ) {

            Text("Hello World")
        }
        Surface(elevation = 14.dp) {
            AppBar(
                modifier = Modifier,
                appBarHeight = appBarHeight
            ) { }
        }
    }
}

@Composable
fun BottomSheetContent(
    appBarHeight: Dp,
) {
    val padding by animateDpAsState(
        targetValue = appBarHeight,
        animationSpec = tween(durationMillis = animationDuration)
    )
    val scrollState = rememberScrollState()
    Column(
        modifier = Modifier
            .fillMaxWidth()
            .padding(top = padding)
            .verticalScroll(scrollState)
            .padding(horizontal = 16.dp)
    ) {
        repeat((0..22).count()) {
            Text("$it", modifier = Modifier.padding(16.dp))
        }
    }
}


Solution

  • The issue was in the Material library version that I was using.

    I was using this version androidx.compose.material:material:1.2.1 but after updating the dependency to this version 1.6.0-alpha05 It worked as expected!