Modifier.scrollable doesn't scroll the content

Question

I am trying to have a layout where the content should be scrollable. But it doesn't work. Am I doing anything wrong here?

@Composable
fun Screen() {
    Box(
        modifier = Modifier
            .padding(16.dp)
            .fillMaxSize()
    ) {
        val offset = remember { mutableStateOf(0f) }
        Column(                                      // This should be scrollable
            modifier = Modifier
                .fillMaxSize()
                .scrollable(
                    orientation = Orientation.Vertical,
                    state = rememberScrollableState { delta ->
                        offset.value = offset.value + delta
                        delta
                    }
                )
        ) {
            Text(...)
            Text(...)
            Spacer(modifier = Modifier.padding(8.dp))
            LazyColumn(...)
            Spacer(modifier = Modifier.padding(8.dp))
            DropdwonMenu(...)
            Text(...)
            Spacer(modifier = Modifier.padding(8.dp))
            Text(...)
            Spacer(modifier = Modifier.padding(8.dp))
            Column(...)
            Spacer(modifier = Modifier.padding(8.dp))
            Button(...)
        }
        Column(
            Modifier
                .fillMaxWidth()
                .align(Alignment.BottomCenter)
        ) {
            Error(snackbarHostState)
        }
    }
    LaunchedEffect(state.error) {
        if (state.error.isNotEmpty()) {
            snackbarHostState.showSnackbar(state.error)
        }
    }

Answer 1

Replace scrollable with .verticalScroll(rememberScrollState()). Your code is updating offset but this value is not actually being used anywhere to offset content. scrollable is useful if you need fine control over scrolling. But it appears in your case that you don't need it and verticalScroll will do the job.