IOS - 如何使用水平滚动列表创建TableView

Question

我试图用可滚动的水平项目（项目数量未知）实现一个表格视图，如下图所示：

用户界面的行为应如下：

1. 在初始状态下，表格单元格显示一个标签和一些文本，圆形项目从右侧弹出
2. 如果用户从右向左滑动，标签和文字会淡出，水平列表（在单元格内）会占据它的位置

---

我考虑过使用TableView和dequeueReusableCellWithIdentifier并创建原型单元格，但是我需要记住列表水平位置并在cellForRowAtIndexPath上正确初始化单元格，这可能会影响性能。

问：为了实现这一目标，您将使用哪种布局，任何输入/教程都将受到赞赏

Answer 1

使用UITableView并将UICollectionView添加到可重复使用的tableView单元格中。 UICollectionView的工作方式类似于UITableView，因为＆＃34; items＆＃34; （如单元格）只有当它们出现在屏幕上时才可重复使用和实例化。我做了一个快速谷歌搜索教程，发现UICollectionView in UITableViewCell。检查一下有关设计的其他一些StackOverflow问题，你应该是金色的。

Answer 2

您可以使用ScrollView放入您的tableview并设置值＆＃34;方向锁启用＆＃34;和＆＃34;分页已启用＆＃34;对于scrollview，为true。

Answer 3

如果每个scrollview中有大量UI元素，则使用UIScrollView可能需要付出很大的努力，因为您必须预先实例化所有这些元素。更好的解决方案是定义自定义UITableViewCell，它有自己的UITableView，但在90度旋转以进行水平滚动。内部的UI元素仅在需要使用dequeueReusableCellWithIdentifier:forIndexPath:显示时才会创建。请参阅一些示例代码，了解如何创建90度旋转表视图：

iPhone Tableview Use Cells in Horizontal Scrolling not Vertical

Answer 4

-SwiftUI

在swiftUI中，您可以将0和Stack的功能与ScrollView一起使用（如果需要）：

List

在此示例中，我将struct ContentView: View { var verticalData = 0...3 var horizontalData = 0...15 var body: some View { List(self.verticalData, id: \.self) { vData in ScrollView(.horizontal) { HStack(spacing: 16) { ForEach(self.horizontalData, id: \.self) { _ in Circle() .foregroundColor(.blue) .frame(width: 40, height: 40, alignment: .center) } } } } } } 用于垂直数据，将水平List用于包含ScrollView（水平堆栈）的圆。

-示例

以下代码是唯一可以完全复制插图的视图的代码（四年后，在iPhone Xs上）：

HStack

-结果