Vertical scroll affecting the modifier weight in jetpack compose

Question

I want my button to be bottom of the screen using Column. When I am trying to smaller device my content is not scrollable. So I search in stack overflow and found this answer. When I am adding

.verticalScroll(rememberScrollState())

in my modifier it breaks the spacer weight stuff and placed my button to top.

Input

@Composable

fun Input() {
    Column(
        modifier = Modifier
            .fillMaxSize()
            .verticalScroll(rememberScrollState())
            .padding(10.dp)
    ) {
        Item()
    }
}

Item

@Composable
fun Item {
    Image()
    Text() // more item here
    Pressure()
}

Pressure

@Composable
fun Pressure() {
      var value by rememberSaveable(stateSaver = TextFieldValue.Saver) {
         mutableStateOf(TextFieldValue())
      }
    Column {
        Text(value)
        Image()
        // more item here
        Spacer(modifier = Modifier.weight(1f))
        OnSubmit(value)
    }
}

Actual Output

Expected Output

I want my button to be bottom with vertical scroll in smaller device.

UPDATE

After @SemicolonSpace I tried code and my button is behind from the screen

fun Input() {
        Column(
            modifier = Modifier.fillMaxHeight(),
            verticalArrangement = Arrangement.SpaceBetween
        ){
          Column(
              modifier = Modifier
                  .verticalScroll(rememberScrollState())
                  .padding(10.dp)
          ) {
              Item()
          }
          // behind from screen
          OnSubmit()
       }
    }

You can see my button is behind the screen, I cannot scroll

Answer 1

I don't know where exactly you face the issue. I made a sample with similar structure as in the images and looks like it works fine if i'm not missing anything.

@Composable
private fun MyComposable() {
    Column(
        modifier = Modifier
            .fillMaxSize()
            .verticalScroll(rememberScrollState())
            .padding(10.dp)
    ) {
        var text by remember { mutableStateOf("") }
        Row(
            modifier = Modifier.fillMaxSize(),
            horizontalArrangement = Arrangement.SpaceEvenly,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text("Left")
            TextField(value = text, onValueChange = { text = it })
            Text("Right")

        }

        Spacer(modifier=Modifier.height(20.dp))
        Row(
            modifier = Modifier.fillMaxSize(),
            horizontalArrangement = Arrangement.SpaceEvenly,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text("Left")
            TextField(value = text, onValueChange = { text = it })
            Text("Right")

        }

        Spacer(modifier=Modifier.height(20.dp))
        Row(
            modifier = Modifier.fillMaxSize(),
            horizontalArrangement = Arrangement.SpaceEvenly,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text("Left")
            TextField(value = text, onValueChange = { text = it })
            Text("Right")
        }

        Spacer(modifier=Modifier.height(20.dp))
        Row(
            modifier = Modifier.fillMaxSize(),
            horizontalArrangement = Arrangement.SpaceEvenly,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text("Left")
            TextField(value = text, onValueChange = { text = it })
            Text("Right")

        }

        Spacer(modifier=Modifier.height(20.dp))
        Row(
            modifier = Modifier.fillMaxSize(),
            horizontalArrangement = Arrangement.SpaceEvenly,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Text("Left")
            TextField(value = text, onValueChange = { text = it })
            Text("Right")

        }

        Spacer(modifier = Modifier.weight(1f))
        Button(modifier = Modifier
            .padding(10.dp)
            .fillMaxWidth(),
            colors = ButtonDefaults.buttonColors(
                backgroundColor = Color(0xff4DD0E1),
                contentColor = Color.White
            )
            , onClick = { /*TODO*/ }) {
            Text("Submit", modifier = Modifier.padding(vertical = 20.dp))
        }
    }

}