在从UITableView到UIView的交互式过渡中动画子视图

Tim*_*van 10 transitions ios ios7

对于仅支持iOS7的应用程序,我有一个UITableView(虽然如果有帮助的话,将它更改为UICollectionView会是学术性的),其中单元格如下所示:

+----------------------------------+=======+
| Label1                           | sub-  |
| Label2     Label3                | view  |
+----------------------------------+=======+
Run Code Online (Sandbox Code Playgroud)

我想转换到第二个视图,其中子视图缩小为更大,标签位置更改,更像是这样:

          +----------+
          |          |
          | subview  |
          |          |
          +----------+
             Label1
             Label2
             Label3
Run Code Online (Sandbox Code Playgroud)

这类似于iOS7日历应用程序,其中视图正在转换并在途中为部件设置动画.我知道我需要实现UIViewControllerAnimatedTransitioning,但我在概念上遇到类似这样的事情会有问题.我是否隐藏了单元格的子视图,用新视图的子视图替换它们但是在同一个地方,然后设置动画?还是有一种不太复杂的方式?任何示例代码都会受到赞赏,因为我发现的所有示例都没有从一个视图到另一个视图的子视图.

ETA:我越想到这一点,我就越想知道:使用带有流布局的UICollectionView可以更好地处理这个问题,并且只需要将细节调整为将单元格大小调整为屏幕的完整大小吗?

jrt*_*ton 11

我认为,iOS7日历动画是通过集合视图动画过渡布局来完成的,这对于这种情况来说很棒,但并不是你想要的.此外,它们似乎让您在同一个视图控制器中,这可能不适合您在上面描述的主 - 细节场景.

我最近一直在玩动画过渡,并发现iOS7中可用的新快照视图非常适合这类事情.

我是自动布局的忠实粉丝,但使用约束的过渡动画太复杂了.但是,您可以假设在转换开始时,您的视图已经布局,因此您可以应用以下原则:

  • 将传入视图添加到视图层次结构中
  • 在此基础上创建一个空白画布视图
  • 创建外发视图的快照并将其添加到画布
  • 创建传入视图的快照并将其添加到画布
  • 在两者之间执行动画
  • 删除画布

由于布局已经发生,您可以在这些快照上使用现有视图的centerframe属性,并仅对其进行动画处理.它使代码更容易阅读.这就是Augie上面评论的内容.

在您的情况下,您可以通过将所选单元格的各种视图绑定到传入控制器的视图,并将它们设置为新位置来获得您所获得的效果.

我已经在GitHub上提供了这个转换的示例项目.最终效果如下:

示例视频

这只是一个快速示例,用于说明如何执行动画.在生产代码中,您可能会使参与控制器符合协议,在这些协议中,它们返回了许多视图以用于转换,而不是直接公开属性并将转换绑定到这些特定类.