如何创建向上/向下滑动的 UITableView？

Posted 2023-03-16

【中文标题】如何创建向上/向下滑动的 UITableView？

【英文标题】：How to create up/down swipeable UITableView?

【发布时间】：2017-06-14 11:59:57

【问题描述】：

我在 UIViewController 的底部有一个 UITableView，tableview 的高度现在是 100 点。

tableview 有 20 个单元格，tableview 的标题视图是 100 点。我在表格视图标题中添加了一个向上的 UISwipeGestureRecognizer 和一个向下的 UISwipeGestureRecognizer。

现在我想在向上手势动作中将 tableview 高度约束常量更改为 400，在向下手势动作中将 tableview 高度约束常量更改为 100。

现在的问题是手势识别器在 tableview 中不起作用 启用 tableview 滚动时的标题。 如果禁用了 tableview 滚动，则手势识别器是 在职的。但是一旦 tableview 高度是，就无法查看所有单元格 改变了。

【参考方案1】：

这是一种不同的方法。根本不要使用滑动手势识别器。

相反，让表格始终保持完整的 400 点高。将其contentInset.top 设置为300。这将允许表格视图滚动，以便在屏幕底部仅显示其前100 个内容点。具体来说，表格视图将允许其contentOffset.y（这是它的垂直滚动位置）下降到-300（而不是仅仅下降到0）。表格的内容总是从y = 0 开始，所以当表格的contentOffset.y 为-300 时，只有其内容的前100 个点可见。随着contentOffset.y 的增加，它的更多内容变得可见。

然后，覆盖表视图的point(inside:withEvent:) 方法，仅对带有y >= 0 的点返回true。这意味着当滚动其内容时，表格将忽略（通过）其内容上方的触摸，因此只有前 100 个点可见。

这是一张小桌子的最终效果：

或者对于一张大桌子：

您可以找到详细说明（在 Objective-C 中）和完整测试项目的链接（也在 Objective-C 中）in this answer。

【讨论】：

当你想隐藏它时，设置它的 contentInset.top ........太棒了！！！！！！！！！

设置contentInset.top总是。 contentOffset.y（也就是它的垂直滚动位置）决定了它是否隐藏。我已经更新了我的答案，以便更清楚地说明这一点。

【参考方案2】：

因为它可能对其他人有所帮助，所以这是解决此类问题的最简单的可能解决方案。

---

非常简单的解决方案 -

没有花招，没有什么花哨的 -

没有“表格视图标题”。

只需新建一个 UIViewController

class TableWithRedTop: UIViewController

有...

[ red area .. swipe detection ]
[ main area - the table view]

然后简单地将“TableWithRedTop”放入容器视图中。

(Container view tutorial if you need one.)

在你的MainView 打个电话

func toggleTableHeight

当 'TableWithRedTop' 被滑动时，有一行代码在 MainView 中调用 toggleTableHeight

请注意，在 toggleTableHeight 中，您可以轻松地为高度变化设置动画、倾斜角度、复制它或做任何您想做的事情，就像您在 MainView 中使用容器视图一样。

【讨论】：

感谢您的回答。我尝试使用带有 UIView(redview)、UITableview 的容器视图。但是当我滚动 tableview 时，redview 浮动在容器视图的顶部。

啊，你想让它*"与"表格视图一起消失。这几乎是不可能的。

【参考方案3】：

我将提出另一个建议，可能会为您解决问题。

这可能是你想要的：

“自扩展”表...

为简单起见，首先在没有动画的情况下实现以下内容。

您有桌子有两个高度，小号和大号。

从高度小的表格开始。

值得注意的是，您只需要实现这两个规则：只需两行简单的代码：

---

任何时候用户向上滚动 - 事实上，更改为“高度大”。

任何时候用户向下滚动，和，你在表格的顶部位置（即你可以请参阅单元格 #1) 实际上更改为“高度小”。

---

这是“如此简单，很难相信它有效！”的事情之一！

我认为它有时被称为“上拉桌”。

（注意。如果您不熟悉检测用户何时滚动，幸运的是它是trivial - code shown here for example。）

【讨论】：

顺便说一句，因为这并不是对您出色问题的真正答案，所以不要考虑它的赏金！ :)

【参考方案4】：

将两个滑动手势的 cancelsTouchesInView 设置为 true 并确保将手势直接添加到标题而不是 tableView。

这应该可以解决问题，但也应该添加一个带有手势识别的视图到容器视图中，并设置它的约束以匹配 tableView 的顶部、左侧和右侧约束，并将其高度设置为 100。