如何在Compose Jetpack中创建回收者视图？

Question

在Compose Jetpack中是否有任何特殊的方法来创建recyclerView？还是和平常一样？

Answer 1

在jetnews的{​​{1}}示例项目中，他们将list/recyclerview与VerticalScroller一起使用，并使用Column来填充forEach函数下面的项目

@Composable

有关类和方法，请检查此链接

https://github.com/android/compose-samples/blob/master/JetNews/app/src/main/java/com/example/jetnews/ui/interests/InterestsScreen.kt

有关更多信息，您可以从此处的链接下载/克隆@Composable private fun TabWithTopics(tabname: String, topics: List<String>) { VerticalScroller { Column { HeightSpacer(16.dp) topics.forEach { topic -> TopicItem( getTopicKey( tabname, "- ", topic ), topic ) TopicDivider() } } } } 示例

https://github.com/android/compose-samples/tree/master/JetNews

希望对您有帮助。

Answer 2

JetNews应用程序中的示例包含静态数据。值得一提的是，根据recent Google presentation（尤其是从18:30开始），我们应该考虑ScrollingList，该列表旨在用于元素数量不确定的列表（例如，从Web下载）。通常由RecyclerView处理。然后，它应如下所示：

@Composable
fun NewsFeed(stories: List<StoryData>) {
  ScrollingList(stories) { story ->
    StoryWidget(story)
  }
}

或者我们可以使用LiveData或RxJava Observable / Flowable做类似的事情：

@Composable
fun NewsFeed(stories: LiveData<List<StoryData>>) {
  ScrollingList(stories.observe()) { story ->
    StoryWidget(story)
  }
}

在这种情况下，我们将在迭代的每一步中重新使用StoryWidget（或我们选择的任何其他小部件），并通过lambda表达式动态地发出数据。

Answer 3

即使是新用户也需要进一步更新。从 0.1.0-dev14 开始，不推荐使用AdapterList和LazyColumnItems。{p>

Answer 4

通过1.0.0-alpha01，您可以使用：

• LazyColumnFor获取垂直列表
• LazyRowFor获取水平列表。

类似的东西：

@Composable
fun LazyRowItemsDemo() {
    LazyRowFor(items = (1..1000).toList()) {
        Text(text = "Item $it")
    }
}

Answer 5

已更新，当前在 dev06 Jetpack Compose 上的实现使用Wed, 11 Mar 2020 16:10:32 +0100，您可以使用Nurseyit Tursunkulov附带的简单示例，我可以分享一个更复杂（在实际情况下使用）：

• 您的AdapterList必须“知道”，并且当前可用的是List<Any>
• 您可以使用ModelList<Any>标签创建模型，因为它们会改变状态，并且@Model函数会知道（使用@Compososable）

示例代码：

MutableList

结果：

Answer 6

According to this article有一个新版本：

@Composable
fun <T> AdapterList(
 data: List<T>,
 modifier: Modifier = Modifier.None,
  itemCallback: @Composable() (T) -> Unit
)

@Composable
 fun Scrollable(
dragDirection: DragDirection,
scrollableState: ScrollableState,
onScrollStarted: (startedPosition: PxPosition) -> Unit = {},
onScrollStopped: (velocity: Float) -> Unit = {},
enabled: Boolean = true,
children: @Composable() () -> Unit
)

 AdapterList(
    data = (1..20).map { it }.toList()
) {
    if (it % 2 == 0) {
        Text("$it Even", style = TextStyle(fontSize = 40.sp, color = 
  Color.Gray))
    } else {
        Text(text = "$it Odd", style = TextStyle(fontSize = 70.sp))
    }
}

Answer 7

这是一个示例代码，它使用AdapterList在compose中实现recylcerview

@Composable
fun Feeds(feeds:LiveData<List<Feed>>) {
    val mFeeds by feeds.observeAsState(emptyList())
    AdapterList(data = feeds){feed->
    FeedsItem(feed)
    }
}