如何重新创建 Jetsetter 的 iOS 预告照片和照片查看器幻灯片过渡？

Question

我遇到的最令人印象深刻的 iOS 应用之一是 Jetsetter，因为它具有出色的设计、令人难以置信的界面和对动画的创造性使用。我最喜欢的应用程序组件之一是他们为酒店/场地提供的预告照片界面。它们提供了一个最小化的照片幻灯片，但如果你想要完整的视图，你可以单击它，它会展开以显示更大版本的图像。你可以在here看到一个模糊的视频。

我有兴趣重新创建类似的东西。我很清楚MHPagingScrollview 之类的分页画廊（这是较大的照片查看器的功能），但我想弄清楚的是处理过渡的正确方法。我还看到了处理图像的Ken Burns effect 的库。但是不清楚的是是否有单独的视图控制器。

这是两个独立视图控制器之间的过渡吗？或者最小化和最大化的照片查看器是同一个控制器的一部分吗？你将如何最有效地复制类似的东西？我在下面嵌入了一个屏幕截图来说明之前和之后。然而，video linked above 最有效地说明了这种转变。

Answer 1

来自 Jetsetter 的移动工程师。它们是两个独立的控制器，但过渡动画发生在第一个控制器中。流程如下：

1. 用户点击较小的照片。
2. 包含完整尺寸图像的过渡视图直接放置在较小图像的顶部。
3. 过渡视图动画到屏幕边界。
4. 照片查看器控制器以不带动画的模式呈现，在一个无缝动画中完成效果。

模态控制器关闭时效果相反。

诀窍在于您的过渡视图。我们创建了一个包含 imageView 的 UIView 子类（启用了 clipsToBounds）。过渡视图的边界展开以显示 imageView，从而在动画期间不会导致最终图像失真。