web-dev-qa-db-fra.com

Comportement FidViewPort dans la colonne de compose de jetpack

Y a-t-il quelque chose comme ScrollView _ _ fillViewPort à jetpack compose Column?

Voir cet exemple:

@Composable
fun FillViewPortIssue() {
    Column(
        Modifier
            .fillMaxSize()
            .padding(16.dp)
    ) {
        for (i in 0..5) {
            Box(
                modifier = Modifier
                    .padding(vertical = 8.dp)
                    .background(Color.Red)
                    .fillMaxWidth()
                    .height(72.dp)
            )
        }
        Spacer(modifier = Modifier.weight(1f))
        Button(
            modifier = Modifier.fillMaxWidth(),
            onClick = { /*TODO*/ }
        ) {
            Text("Ok")
        }
    }
}

C'est le résultat:

enter image description here

Lorsque l'appareil est dans le paysage, le contenu est recadré, car il n'y a pas de défilement. Si j'ajoute le modificateur verticalScroll faire le Column...

    ...
    Column(
        Modifier
            .verticalScroll(rememberScrollState()) // <<-- this
            .fillMaxSize()
            .padding(16.dp)
    ) {
    ...

... Le problème de défilement est corrigé, mais le bouton monte, comme ça.

enter image description here

Dans la boîte à outils traditionnelle, nous pouvons résoudre ce problème en utilisant ScrollView + fillViewPort propriété. Y a-t-il quelque chose d'équivalent à composer?

androidandroid-jetpack-compose
10
nglauber

J'ai eu un problème similaire récemment et substitué verticalScroll pour scrollable(rememberScrollState(), Orientation.Vertical) qui semblait fonctionner pour mon cas et permettre à l'écran de remplir sa fenêtre de défilement

1
alfietap