如何实现UIView的翻转过渡效果

时间:2012-01-25 10:58:15

标签: iphone uiview transition

如何在“flipboard”应用程序中实现UIView的翻转过渡效果。在这里,我已经有了从左到右或从右到左翻转的样本。但在这里,我想实现从底部到顶部或从上到下的折叠翻转。

3 个答案:

答案 0 :(得分:3)

您可以使用以下代码行来制作此类动画

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:5];
[UIView transitionFromView:view2 toView:view1 duration:3 options:UIViewAnimationOptionTransitionFlipFromBottom completion:NULL];
[UIView commitAnimations];  

你可以按照要求设置持续时间和动画转换..只能在ios5中使用..

答案 1 :(得分:1)

查看本教程:http://www.gethugames.in/blog/2012/02/extended-epgltransitionview.html 这个项目:https://github.com/saiy2k/EPGLTransitionView

PS:我自己的博客和我的EPGLTransitionView分支链接

答案 2 :(得分:0)

这是我如何尝试解决问题的概念。也许我会尝试在空闲时间实现它,以便有一个方便的样本。

  • 当您开始动画时,通过将其图形上下文读入位图来制作当前UIView的快照
  • 创建三个(是的,三个 - 裸露的,我UIView的大小,以便它们构成要翻转的视图的两半,有两个区域视图右半部分
  • 在左视图(第一个)上绘制一半位图,在右视图上绘制右半部分(第二个),在各自的drawRect:中实现
  • 隐藏原始视图
  • 创建我们要转换到的下一个视图
  • 将其内容也添加到位图中
  • 隐藏下一个视图
  • 使第三个临时UIView绘制图像的右半部分(第三个​​
  • 第三个​​放在第二个
  • 第二个沿其左边缘
  • 的一半翻转动画
  • 第二个显示在下一个视图的左半部分
  • 制作剩余的翻转动画
  • 完成转换后,显示下一个视图,隐藏所有临时视图
  • Et voilla!至少我希望。

我认为你可以使用一个带有三个CALayers的UIView代替那三个UIView。

并且存在以交互方式进行过渡的问题,用户将手指滑过页面。

我还认为翻转视图存在双面图层的问题。没有机会玩这些房产以及他们可以帮助实现的目标。

另一个解决方案是从UIView的内容创建一个纹理,并在其上面放置一个OpenGL表面(alpha-transparent CAEAGLLayer - 基于当然之一)。那么你对用这个图像纹理化的三角形所做的只会受到你想象力的限制。我想这也可以创建一个类似Genie的移动垃圾动画,这是Mail iOS应用程序使用的。

编辑:哦,对不起,我正在考虑从右到左翻转式翻转,而不是从上到下,但总的想法当然是一样的。