如何在 Jetpack Compose 中从卡片中显示 lazylist 项目
How to show items of lazylist out of the Card in Jetpack Compose
我在 Card 中有 LazyRow,我希望滚动项目出现在卡片之外,
你能指导我吗,我该怎么做?
预先感谢您的帮助。
当您需要在 Card
之上显示某些内容时,您可以使用 Box
。您可以计算所需的填充以匹配卡片。在这种情况下,将 Card
视为背景视图。
val outerPadding = 20.dp
val innerPadding = 20.dp
Box {
Card(
backgroundColor = Color.White,
elevation = 10.dp,
modifier = Modifier.padding(outerPadding).aspectRatio(1f).fillMaxWidth()
) {
}
Column(
Modifier
.matchParentSize()
.padding(vertical = outerPadding + innerPadding)
) {
Text(
"Your title",
modifier = Modifier.padding(horizontal = outerPadding + innerPadding)
)
HorizontalPager(
count = 10,
contentPadding = PaddingValues(horizontal = outerPadding + innerPadding),
itemSpacing = innerPadding / 2,
modifier = Modifier.weight(1f)
) {
Box(Modifier.fillMaxSize().background(Color.Green))
}
Text(
"Your indicator",
modifier = Modifier
.padding(horizontal = outerPadding + innerPadding)
.align(Alignment.CenterHorizontally)
)
}
}
结果:
我在 Card 中有 LazyRow,我希望滚动项目出现在卡片之外, 你能指导我吗,我该怎么做?
预先感谢您的帮助。
当您需要在 Card
之上显示某些内容时,您可以使用 Box
。您可以计算所需的填充以匹配卡片。在这种情况下,将 Card
视为背景视图。
val outerPadding = 20.dp
val innerPadding = 20.dp
Box {
Card(
backgroundColor = Color.White,
elevation = 10.dp,
modifier = Modifier.padding(outerPadding).aspectRatio(1f).fillMaxWidth()
) {
}
Column(
Modifier
.matchParentSize()
.padding(vertical = outerPadding + innerPadding)
) {
Text(
"Your title",
modifier = Modifier.padding(horizontal = outerPadding + innerPadding)
)
HorizontalPager(
count = 10,
contentPadding = PaddingValues(horizontal = outerPadding + innerPadding),
itemSpacing = innerPadding / 2,
modifier = Modifier.weight(1f)
) {
Box(Modifier.fillMaxSize().background(Color.Green))
}
Text(
"Your indicator",
modifier = Modifier
.padding(horizontal = outerPadding + innerPadding)
.align(Alignment.CenterHorizontally)
)
}
}
结果: