向下拖动以关闭 ViewController

Drag down to dismiss a ViewController

我正在构建一个以 MKMapView 为背景的应用程序,我想要一个 "slide-up/down" 视图,就像在 Google 地图或 Spotify 中一样(example.gif),可以通过将其向下拖动来消除。

'slide-up/down-view' 将包含很多信息,包括 UITableView,所以我可能希望它有自己的 ViewController,而不仅仅是 [=14] =] 一个人。 对此有什么好的方法?

是否可以"just"添加一个childViewController/ContainerView并给它一个UIPanGestureRecognizer?感谢所有帮助!

遗憾的是,这些视图控制器转换非常复杂,但网上有很多关于它们的优秀教程。您将子视图放入其自己的视图控制器中是正确的。还需要其他几个移动部件。对它们进行全面详细说明 material 足以写一本关于该主题的书,但高级概述是这样的:

第 1 章:容器

将具有地图视图的视图控制器视为视图控制器 A。将 slide-up/down 视图视为视图控制器 B。我们希望从 A 无缝过渡到 B(以及 B 到 A)。 Cocoa 提供了一个 API 用于执行此操作,但首先您需要一个包含 A 和 B 的 container view controller 作为 child 视图控制器。这可以是导航控制器或您自己的自定义容器控制器。

第 2 章:非交互式自定义容器视图控制器转换

获得容器视图控制器后,对其进行编码,以便您可以通过按一个按钮从 A 转到 B 并返回。 (在你的应用程序的某个地方放一个调试按钮。)所以你点击一个按钮,然后从 A 转到 B,然后你再次点击它从 B 转到 A。要做到这一点,有 noninteractive custom container view controller transition APIs (it's a mouthful). This will require implementing an animation controller and a transitioning delegate, as detailed in that excellent objc.io tutorial and its corresponding GitHub repository.

第 3 章:交互式自定义容器视图控制器转换

但是,当然,您希望用户上下滑动以触发转换。这将带您进入 interactive blah blah blah APIs, where you implement an interaction controller and connect it to a pan gesture recognizer. The corresponding GitHub repository to that blog post 的世界,实际上您会像您一样使用平移手势。这是一项特别挑剔的工作,因为如果用户决定在中途停止平移,您可能希望取消过渡,但所有这些都在代码和文章中进行了详细说明。

第 4 章:视图共享

其实我不确定这叫什么。这里的问题是你想要 Google Maps / Spotify 的外观和感觉,当你在视图控制器 A 中时,视图控制器 B 的视图的一部分实际上是可见的。平移手势识别器附加到 B 的视图所以当你向上滑动它时,B 的视图会变得越来越大,直到交互式动画结束并且你已经从 A 过渡到 B。关于这个有好的教程吗?我还没有找到,但它作为一种 iOS UX 习语正变得越来越普遍。

我自己have a small demo project illustrating how to do this。我所做的是我有一个导航控制器作为我的容器视图控制器。导航控制器的根视图控制器是我的主视图控制器(视图控制器 A)。在视图控制器中,我将视图控制器 B 作为 child。这就是导航控制器拥有 A 拥有 B。

当用户点击 B 时,我 push B onto the navigation stack, thus reparenting it. At that point, my noninteractive animation controller 作为自定义导航控制器推送动画启动。所以看起来 B 正在从它的小边界平滑地变形到它的大边界。 (我推荐 运行 xcodeproj 来查看效果,因为我对它的描述做得很糟糕。)

此技术同样适用于交互式动画。至于它是否是最好的技术,我认为这是有待商榷的——有很多方法可以做你在 Google 地图和 Spotify 应用程序中看到的事情。 Apple 当然可以更好地记录复杂的交互式动画的 APIs。

我会提醒您在调整并准备好动画之前避免使用自动布局,因为它与动画控制器的交互效果不佳。好的 ol' 框架矩形数学在这里是最好的,直到你找到你的方位。 Auto Layout 很神奇,正如您可能会从这个答案的冗长程度中看出的那样,已经有足够的魔法可以解决。

另请参阅

您可以单击 asciiwwdc.com 页面右上角的紫色 Apple 徽标来观看演讲视频或从“资源”选项卡中获取 PDF。 iOS 的一些最佳文档已锁定在这些 WWDC 演讲中。