Compose中Accompanist Horizontal Pager占满最大尺寸且verticalAlignment无效

问题根因说明 #

你遇到的两个问题均和你使用的0.21.3-beta版本的旧版Accompanist Pager特性有关：

• 旧版Pager默认测量逻辑会强制填充父布局给到的最大可用高度，不支持原生自适应内容尺寸
• 子项如果使用wrapContentSize修饰符，会覆盖Pager传递的verticalAlignment对齐规则

具体修复步骤 #

1. 给HorizontalPager添加Modifier.height(IntrinsicSize.Min)修饰符，强制Pager测量所有子项高度，取最大值作为自身高度，实现自适应内容高度
2. 删除LazyVerticalGrid的wrapContentSize()修饰符，替换为fillMaxWidth() + wrapContentHeight()，让Pager的verticalAlignment规则可以生效

修改后代码示例 #

HorizontalPager(
    state = stickerBookState.pagerState,
    modifier = Modifier
        .constrainAs(pager) {
            top.linkTo(pagerNavigator.bottom, 16.dp)
            linkTo(parent.start, parent.end)
            height = Dimension.wrapContent
            width = Dimension.fillToConstraints
        }
        .height(IntrinsicSize.Min) // 新增这行实现自适应高度
        .background(PmColors.CompletedGreen),
    verticalAlignment = Alignment.Top,
    count = model.pages.size,
) { pageIndex ->
    val pageData = model.pages[pageIndex]
    @OptIn(ExperimentalFoundationApi::class)
    LazyVerticalGrid(
        modifier = Modifier
            .fillMaxWidth() // 替换原来的wrapContentSize
            .wrapContentHeight() // 保留自适应高度
            .background(PmColors.AlertRed),
        cells = GridCells.Fixed(2)
    ) {
        items(pageData) { holderData ->
            Box(
                modifier = Modifier
                    .padding(bottom = 24.dp)
                    .fillMaxWidth()
                    .wrapContentHeight(),
                contentAlignment = Alignment.Center
            ) {
                // some composable
            }
        }
    }
}

额外说明 #

如果升级Accompanist Pager到0.24.0-alpha及以上版本，官方已经新增了wrapContentHeight的原生支持，不需要额外加IntrinsicSize修饰符也可以实现自适应高度。

内容的提问来源于stack exchange，提问作者Nazar Dunets