KotlinCompose列表手动控制列表。给Column添加滚动能力LazyColumn动画滚动到底部

篇首语：本文由编程笔记#小编为大家整理，主要介绍了Kotlin Compose 列表 手动控制列表。给Column添加滚动能力 LazyColumn动画滚动到底部相关的知识，希望对你有一定的参考价值。

&＃64;Composable
fun SimpleColumn()
Column()
repeat(100)
Text(text &＃61; "Item #$it", style &＃61; MaterialTheme.typography.subtitle1)




有缺陷&＃xff0c;无法进行上下滚动

&＃64;Composable
fun SimpleList()
val scrollState &＃61; rememberScrollState()
Column(Modifier.verticalScroll(scrollState))
repeat(100)
Text(text &＃61; "Item #$it", style &＃61; MaterialTheme.typography.subtitle1)




滑动文字既可以滑动&＃xff0c;不要滑动空白区域。那还不是Column

滑动红色这块区域

下面我们写一个滚动列表 用按钮控制滚动

添加依赖

加载网络图片

implementation &＃39;io.coil-kt:coil-compose:2.1.0&＃39;

&＃64;Composable
fun ScrollingList()
val scrollState &＃61; rememberLazyListState()
val coroutineScope &＃61; rememberCoroutineScope()
val listSize&＃61;100
Column()
Row()
Button(modifier &＃61; Modifier.weight(1f), onClick &＃61;
coroutineScope.launch
scrollState.animateScrollToItem(0)

)
Text("Scroll to the top")

Button(modifier &＃61; Modifier.weight(1f), onClick &＃61;
coroutineScope.launch
scrollState.animateScrollToItem(listSize - 1)

)
Text("Scroll to the end")


LazyColumn(state &＃61; scrollState)
items(listSize)
ImageListItem(it)



&＃64;Composable
fun ImageListItem(index: Int)
Row(verticalAlignment &＃61; Alignment.CenterVertically)
Image(
painter &＃61; rememberImagePainter(data &＃61; "https://gimg2.baidu.com/image_search/src&＃61;http%3A%2F%2Fpic1.win4000.com%2Fwallpaper%2F2020-10-12%2F5f83b7c13d0b9.jpg&refer&＃61;http%3A%2F%2Fpic1.win4000.com&app&＃61;2002&size&＃61;f9999,10000&q&＃61;a80&n&＃61;0&g&＃61;0n&fmt&＃61;auto?sec&＃61;1657808691&t&＃61;3a05e7dad6f14402a7c14354e302f51b"),
modifier &＃61; Modifier.size(50.dp),
contentDescription &＃61; null
)
Spacer(modifier &＃61; Modifier.width(10.dp))
Text(text &＃61; "Item #$index", style &＃61; MaterialTheme.typography.subtitle1)



这里用到了

网络图片

rememberImagePainter

这个东西是做什么用的&＃xff1f;

加载网络图片

好像起弃用了

推荐这种写法

&＃64;Composable
fun ImageListItem(index: Int)
Row(verticalAlignment &＃61; Alignment.CenterVertically)
Image(
painter &＃61; rememberAsyncImagePainter( "https://gimg2.baidu.com/image_search/src&＃61;http%3A%2F%2Fpic1.win4000.com%2Fwallpaper%2F2020-10-12%2F5f83b7c13d0b9.jpg&refer&＃61;http%3A%2F%2Fpic1.win4000.com&app&＃61;2002&size&＃61;f9999,10000&q&＃61;a80&n&＃61;0&g&＃61;0n&fmt&＃61;auto?sec&＃61;1657808691&t&＃61;3a05e7dad6f14402a7c14354e302f51b"),
modifier &＃61; Modifier.size(50.dp),
contentDescription &＃61; null
)
Spacer(modifier &＃61; Modifier.width(10.dp))
Text(text &＃61; "Item #$index", style &＃61; MaterialTheme.typography.subtitle1)



点击按钮就可以控制滚动了 非常的好玩。