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

Question

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

我有兴趣重新创造类似的东西.我很清楚像MHPagingScrollview这样的分页画廊(这是更大的照片浏览器的功能),但我想弄清楚的是处理过渡的正确方法.我也见过处理图像的Ken Burns效应的库.然而,尚不清楚的是是否有单独的视图控制器.

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

Answer 1

来自Jetsetter的移动工程师.它们是两个独立的控制器,但过渡动画发生在第一个.这是流程:

1. 用户点按较小的照片.
2. 包含完整尺寸图像的过渡视图直接放置在较小图像的顶部.
3. 转换视图动画到屏幕的边界.
4. 照片查看器控制器显示为没有动画的模态,在一个无缝动画中完成效果.

当模态控制器被解除时,效果反转.

诀窍在于您的过渡视图.我们创建了一个包含imageView的UIView子类(启用了clipsToBounds).转换视图的边界扩展以显示imageView,从而在动画期间不会导致最终图像失真.