[英]Jetpack compose LazyColumn inside LazyCloumn
在我的主页中,我有一个lazycolumn,其中一项是水平寻呼机。 在每个水平寻呼机中都有一些页面,我也需要在其中包含lazyColumn。 错误是您不允许在同一方向使用嵌套滚动。 我应该如何实现这个ui?
@Composable
fun Home() {
LazyColumn {
item { }
item { }
item { }
item {
TabRow(selectedTabIndex =) {
}
}
item {
HorizontalPager(count =) { page ->
when {
page == 0 -> {
LazyColumn {
items(list) {
}
}
}
}
}
}
}
}
我创建了一个示例。 对我来说,它按预期工作。 请看一下
class ComposeActivity8 : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
ComposeTutorialTheme {
Home()
}
}
}
@Composable
fun VItem(text: String) {
Text(modifier = Modifier.padding(40.dp), text = text)
Divider(color = Color.Black)
}
@Composable
fun HItem(content: @Composable BoxScope.() -> Unit) {
Box {
content()
Divider(
color = Color.Red, modifier = Modifier
.align(Alignment.CenterEnd)
.fillMaxHeight()
.width(1.dp)
)
}
}
@Composable
fun CreateLazyColumn(pos: String, countItem: Int) {
LazyColumn {
items(count = countItem, itemContent = { index ->
VItem("$pos.$index")
})
}
}
@Composable
fun Home() {
LazyColumn {
item { VItem("Vertical item 1") }
item { VItem("Vertical item 2") }
item { VItem("Vertical item 3") }
item { VItem("Vertical item 4") }
item {
LazyRow(modifier = Modifier.height(150.dp)) {
item {
HItem {
CreateLazyColumn("Horizontal item 5.1", 6)
}
}
item {
HItem {
CreateLazyColumn("Horizontal item 5.2", 10)
}
}
item {
HItem {
Text(
modifier = Modifier.padding(40.dp),
text = "Horizontal item 5.3"
)
}
}
item {
HItem {
Text(
modifier = Modifier.padding(40.dp),
text = "Horizontal item 5.4"
)
}
}
item {
HItem {
CreateLazyColumn("Horizontal 5.5", 6)
}
}
item {
HItem {
Text(
modifier = Modifier.padding(40.dp),
text = "Horizontal item 5.6"
)
}
}
item {
HItem {
Text(
modifier = Modifier.padding(40.dp),
text = "Horizontal item 5.7"
)
}
}
item {
HItem {
Text(
modifier = Modifier.padding(40.dp),
text = "Horizontal item 5.8"
)
}
}
}
Divider(color = Color.Black)
}
item { VItem("Vertical item 6") }
item { VItem("Vertical item 7") }
item { VItem("Vertical item 8") }
item { VItem("Vertical item 9") }
item { VItem("Vertical item 10") }
item { VItem("Vertical item 11") }
item { VItem("Vertical item 12") }
}
}
}
视频
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.