翻页动画效果

 1 typedef enum : NSUInteger {
 2     Fade = 1,                   //淡入淡出
 3     Push,                       //推挤
 4     Reveal,                     //揭开
 5     MoveIn,                     //覆盖
 6     Cube,                       //立方体
 7     SuckEffect,                 //吮吸
 8     OglFlip,                    //翻转
 9     RippleEffect,               //波纹
10     PageCurl,                   //翻页
11     PageUnCurl,                 //反翻页
12     CameraIrisHollowOpen,       //开镜头
13     CameraIrisHollowClose,      //关镜头
14     CurlDown,                   //下翻页
15     CurlUp,                     //上翻页
16     FlipFromLeft,               //左翻转
17     FlipFromRight,              //右翻转
18
19 } AnimationType;
  1 - (IBAction)tapButton:(id)sender {
  2
  3     UIButton * button = sender;
  4     AnimationType animationType = button.tag;
  5
  6     NSString * subtypeString;
  7
  8     switch (_subtype) {
  9         case 0:
 10             subtypeString = kCATransitionFromLeft;
 11             break;
 12         case 1:
 13             subtypeString = kCATransitionFromBottom;
 14             break;
 15         case 2:
 16             subtypeString = kCATransitionFromRight;
 17             break;
 18         case 3:
 19             subtypeString = kCATransitionFromTop;
 20             break;
 21         default:
 22             break;
 23     }
 24
 25     _subtype += 1;
 26     if (_subtype > 3) {
 27         _subtype = 0;
 28     }
 29
 30
 31     switch (animationType) {
 32         case Fade:
 33             [self transitionWithType:kCATransitionFade WithSubtype:subtypeString ForView:self.view];
 34             break;
 35
 36         case Push:
 37             [self transitionWithType:kCATransitionPush WithSubtype:subtypeString ForView:self.view];
 38             break;
 39
 40         case Reveal:
 41             [self transitionWithType:kCATransitionReveal WithSubtype:subtypeString ForView:self.view];
 42             break;
 43
 44         case MoveIn:
 45             [self transitionWithType:kCATransitionMoveIn WithSubtype:subtypeString ForView:self.view];
 46             break;
 47
 48         case Cube:
 49             [self transitionWithType:@"cube" WithSubtype:subtypeString ForView:self.view];
 50             break;
 51
 52         case SuckEffect:
 53             [self transitionWithType:@"suckEffect" WithSubtype:subtypeString ForView:self.view];
 54             break;
 55
 56         case OglFlip:
 57             [self transitionWithType:@"oglFlip" WithSubtype:subtypeString ForView:self.view];
 58             break;
 59
 60         case RippleEffect:
 61             [self transitionWithType:@"rippleEffect" WithSubtype:subtypeString ForView:self.view];
 62             break;
 63
 64         case PageCurl:
 65             [self transitionWithType:@"pageCurl" WithSubtype:subtypeString ForView:self.view];
 66             break;
 67
 68         case PageUnCurl:
 69             [self transitionWithType:@"pageUnCurl" WithSubtype:subtypeString ForView:self.view];
 70             break;
 71
 72         case CameraIrisHollowOpen:
 73             [self transitionWithType:@"cameraIrisHollowOpen" WithSubtype:subtypeString ForView:self.view];
 74             break;
 75
 76         case CameraIrisHollowClose:
 77             [self transitionWithType:@"cameraIrisHollowClose" WithSubtype:subtypeString ForView:self.view];
 78             break;
 79
 80         case CurlDown:
 81             [self animationWithView:self.view WithAnimationTransition:UIViewAnimationTransitionCurlDown];
 82             break;
 83
 84         case CurlUp:
 85             [self animationWithView:self.view WithAnimationTransition:UIViewAnimationTransitionCurlUp];
 86             break;
 87
 88         case FlipFromLeft:
 89             [self animationWithView:self.view WithAnimationTransition:UIViewAnimationTransitionFlipFromLeft];
 90             break;
 91
 92         case FlipFromRight:
 93             [self animationWithView:self.view WithAnimationTransition:UIViewAnimationTransitionFlipFromRight];
 94             break;
 95
 96         default:
 97             break;
 98     }
 99
100     static int i = 0;
101     if (i == 0) {
102         [self addBgImageWithImageName:IMAGE1];
103         i = 1;
104     }
105     else
106     {
107         [self addBgImageWithImageName:IMAGE2];
108         i = 0;
109     }
110
111 }
 1 #pragma CATransition动画实现
 2 - (void) transitionWithType:(NSString *)type WithSubtype:(NSString *) subtype ForView : (UIView *) view
 3 {
 4     //创建CATransition对象
 5     CATransition * animation = [CATransition animation];
 6
 7     //设置运动时间
 8     animation.duration = DURATION;
 9
10     //设置运动type
11     animation.type = type;
12     if (subtype != nil) {
13         //设置子类
14         animation.subtype = subtype;
15     }
16
17     //设置运动速度
18     animation.timingFunction = UIViewAnimationOptionCurveEaseInOut;
19
20     [view.layer addAnimation:animation forKey:@"animation"];
21 }
22
23
24
25 #pragma UIView实现动画
26 - (void) animationWithView:(UIView *)view WithAnimationTransition : (UIViewAnimationTransition) transition
27 {
28     [UIView animateWithDuration:DURATION animations:^{
29         [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
30         [UIView setAnimationTransition:transition forView:view cache:YES];
31     }];
32 }
时间: 2024-10-06 12:18:45

翻页动画效果的相关文章

windows phone水平滑动翻页动画效果

XAM部分: <phone:PhoneApplicationPage.Resources> <Storyboard x:Name="Init" > <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="

jquery 实现智能炫酷的翻页相册效果

jquery 实现智能炫酷的翻页相册效果巧妙的运用 Html 的文档属性,大大减少jquery 的代码量,实现了智能炫酷的翻页相册.兼容性很好,实现了代码与标签的完全分离?1. [代码]jquery 实现智能炫酷的翻页相册效果 $(document).ready(function(e) {    var ImgBox = $(".img-box"),    ImgSpan = ImgBox.find("span"),    ImgDiv = $(".img

【jQueryMobile】使用jQueryMobile实现滑动翻页的效果

滑动手势在移动设备是很流行的,在移动设备中滑动翻页中很常见 虽然这个功能可以在jQueryMobile中实现,但是个人与之前写的<[jQuery]论手机浏览器中拖拽动作的艰难性>(点击打开链接)中的观点一直,由于这是在手机浏览器中浏览,而不是安卓的一个独立APP,所以不要经常除点击以外的移动设备手势,以免跟手机浏览器与手机系统本身的手势发生冲突. 那么,使用jQueryMobile实现滑动翻页的效果到底怎么做呢? 一.基本目标 在手机浏览器中的jQueryMobile框架页中现实滑动手势翻页的

css3 --- 翻页动画 --- javascript --- 3d --- 准备

用css3和javascript做一个翻页动画<知识准备部分> 如有更多疑问请参照:http://www.imooc.com/learn/77 这是用css3的-webkit-transition属性做的渐变颜色动画,下面是三张截图: 怎么样?好看吧,下面是它的代码: -webkit-transition: background-color 2s;-webkit-是用chrome或safari打开的一个前缀,transition时表示渐变的属性,它的值是 渐变属性 和 渐变时间,上面注释的部分

Android 聊天表情输入、表情翻页带效果、下拉刷新聊天记录

经过一个星期的折腾,终于做完了这个Android 聊天表情输入.表情翻页带效果.下拉刷新聊天记录.这只是一个单独聊天表情的输入,以及聊天的效果实现.因为我没有写服务器,所以没有双方聊天的效果.主要是聊天中表情的选择,发送.表情翻页带有不同的效果.我在主要代码中都写了注释.下面看代码实现.附上本文源码,代码较多. 下载地址:点击 一.先看实现的效果图 二.调用接口以及设置MainActivity package com.example.activity; import java.util.Arra

flex布局构建大屏框架并支持翻页动画、滚动表格功能

本文将利用flex属性构建大屏可视化界面.界面主要分标题栏.工具栏.数据可视化窗口.其中,翻页动画以及滚动表格功能分别分布在数据可视化界面两侧. 鼠标点击标题,可看到左侧窗口翻转动画: 整体布局效果图: 滚动列表效果图及核心代码: var myH = $(".tableBoy").height() + 10;//获取容器高度 确定可视区域 $(".tableBoy").css({ 'height': myH + "px", "overf

15个最佳jQuery的翻页书效果的例子

在这里,你会发现15的jQuery的翻页书的插件,提供了良好的页面翻转的经验,并帮助创建类似书本的效果. jQuery的增添了一道亮丽的过渡到实际的页面在一本书或杂志HTML5. 1. BookBlock: jQuery内容翻转插件 BookBlock是可以将任何内容,如图像或文本创建小册子的组件,允许一个“翻页”的导航. 在线演示 2. imBookFlip : jQuery Page Turning Plugin without Flash imBookFlip可以将iframe加载书本成本

css3实现web app翻页过度效果

最近在开发web app页面,要实现滑动翻页,一开始实现的效果是无任何过渡效果的,可是这样子的话页面会闪跳一下,用户体验非常不好.于是我们主管叫我用jquery mobile,可是用了这个库之后,问题来了,跳转到的目标页面,无法加载目标页面引入的外部css文件,最后用css3完美地解决了这个问题: .pt-page-moveToLeft { -webkit-animation: moveToLeft .6s ease both; -moz-animation: moveToLeft .6s ea

【凯子哥带你夯实应用层】都说“知乎”逼格高,我们来实现“知乎”回答详情页动画效果

转载请注明出处:http://blog.csdn.net/zhaokaiqiang1992 2014已经远去,2015年的目标很简单,就是继续熟悉Android的上层API,虽然偶尔会为了某个问题去研究下FrameWork的代码,但是对于我们这种新手来说,只有对上层的API用的熟练了,才能更好的往下研究原理.所以,今年的任务就是继续学习和研究Android的上层API的使用,顺便写一篇毕业论文,然后毕个业. OK,从这篇开始,咱们就开始[凯子哥带你夯实应用层]系列,如果你有想要实现的界面效果,或