在Jetpack Compose中与VerticalScroll结合使用时,Fill MaxSize修饰符不起作用

fillMaxSize modifier not working when combined with VerticalScroll in Jetpack Compose(在Jetpack Compose中与VerticalScroll结合使用时,Fill MaxSize修饰符不起作用)

本文介绍了在Jetpack Compose中与VerticalScroll结合使用时,Fill MaxSize修饰符不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试着查了一下,但找不到任何相关的东西。

我想在可垂直滚动的Box内放置&Full Size&Column,但这种组合似乎行不通。将verticalScroll(rememberScrollState())修饰符添加到Box时,似乎禁用了Column

fillMaxSize()修饰符

以下代码未按预期工作:

MyTheme {
        Box(
            modifier = Modifier
                .fillMaxSize()
                .border(2.dp, Color.Green) //for visual effect only
                .verticalScroll(rememberScrollState())
        ) {
            Column(
                modifier = Modifier
                    .fillMaxSize()
                    .padding(2.dp)
                    .border(2.dp, Color.Red) //for visual effect only
            ) {
               //some content
            }
        }
}

预期结果:BoxColumn(绿色和红色边框)填满整个屏幕。

实际结果:Box填满屏幕,但Column不填高

但是,如果我从Box中删除verticalScroll()修饰符,我会得到预期的结果:

MyTheme {
        Box(
            modifier = Modifier
                .fillMaxSize()
                .border(2.dp, Color.Green) //for visual effect only
                //verticalScroll modifier removed
        ) {
            Column(
                modifier = Modifier
                    .fillMaxSize()
                    .padding(2.dp)
                    .border(2.dp, Color.Red) //for visual effect only
            ) {
               //some content
            }
        }
}

推荐答案

verticalScroll包装内容的高度,可以拉伸到很长,所以作用域有Constraints.InfinityformaxHeight约束。

发件人fillMaxHeightdocumentation

如果传入的最大高度为Constraints.Infinity,则此修饰符将不起作用。

这就是您需要显式设置height的原因。

考虑切换到LazyColumn(出于此目的而使用fillParentMaxHeight())或切换到Pager(这是专门针对此类情况制定的)。

还有,就像@AdrianK指针一样,使用常规的scrollable可以用BoxWithConstraints包装您的视图,并使用maxHeight设置您的视图的height

BoxWithConstraints {
    Box(
        modifier = Modifier
            .fillMaxSize()
            .border(2.dp, Color.Green)
            .verticalScroll(rememberScrollState())
    ) {
        Column {
            repeat(2) {
                Column(
                    modifier = Modifier
                        // fillMaxWidth instead of fillMaxSize
                        .fillMaxWidth()
                        // explicit height modifier
                        .height(this@BoxWithConstraints.maxHeight)
                        .padding(2.dp)
                        .border(2.dp, Color.Red)
                ) {
                    //some content
                }
            }
        }
    }
}

结果:

这篇关于在Jetpack Compose中与VerticalScroll结合使用时,Fill MaxSize修饰符不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本文标题为:在Jetpack Compose中与VerticalScroll结合使用时,Fill MaxSize修饰符不起作用

基础教程推荐