iOS Controller中视图切换动画效果

标签：oid   视图切换   ges   UI   state   case   set   icon   nts   

最近在一个小项目中遇到一个动画切换的效果,一时被难到了,后来又去看了下苹果公司提供的动画类,找到了几个动画的执行方法,这些默认的动画方法足够满足一般需求的动画效果了,接下来贴代码 首先我们在Controller中创建对应的按钮按钮 CGFloat mainHeight = [UIScreen mainScreen].bounds.size.height; NSArray titleArr = @[@"添加",@"翻页",@"移入",@"揭开",@"立方体",@"收缩",@"翻转",@"水波"]; for (int i = 0; i < 8; i ++) { UIButton button = [UIButton buttonWithType:UIButtonTypeSystem]; button.tag = 100 + i; [button setTitle:titleArr[i] forState:UIControlStateNormal]; //每行四个button NSInteger row = i / 4; NSInteger col = i % 4; [button addTarget:self action:@selector(changePageAnimation:) forControlEvents:UIControlEventTouchUpInside]; button.frame = CGRectMake(5 + col 80,mainHeight - (2 - row) 45 - 20 , 70, 40); [self.view addSubview:button]; } 创建好按钮后我们就可以添加一些视图控件了,这里我添加了两个UIView作为演示用: UIView purpleView = [[UIView alloc] initWithFrame:self.view.bounds]; purpleView.backgroundColor = [UIColor purpleColor]; [self.view addSubview:purpleView]; UIView blackView = [[UIView alloc] initWithFrame:self.view.bounds]; blackView.backgroundColor = [UIColor blackColor]; [self.view addSubview:blackView]; 这里要注意UIView的层级关系 接下来是按钮的点击方法,我这里使用tag值来取当前button

• (void)changePageAnimation:(UIButton *)sender { switch (sender.tag) { case 100: { // 开始执行动画 [UIView beginAnimations:@"animation" context:nil]; [UIView setAnimationDuration:1.0f]; // 控制UIView内过渡动画的类型 [UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.view cache:YES]; // 设置动画的变化曲线 [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; [self.view exchangeSubviewAtIndex:3 withSubviewAtIndex:2]; // 提交动画 [UIView commitAnimations]; } break; case 101: { // 开始执行动画 [UIView beginAnimations:@"animation" context:nil]; [UIView setAnimationDuration:1.0f]; // 控制UIView内过渡动画的类型 [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.view cache:YES]; // 设置动画的变化曲线 [UIView setAnimationCurve:UIViewAnimationCurveEaseOut]; // 交换视图控制器所显示的UIView中中2个子控件位置 [self.view exchangeSubviewAtIndex:3 withSubviewAtIndex:2];

      [UIView commitAnimations];
  }
      break;
  case 102:
  {
      CATransition *transition = [CATransition animation];
      transition.duration = 2.0f;
      // 使用kCATransitionMoveIn动画
      transition.type = kCATransitionMoveIn;
      // 指定动画方向，从左向右
      transition.subtype = kCATransitionFromLeft;
      [self.view.layer addAnimation:transition forKey:@"animation"];
      [self.view exchangeSubviewAtIndex:2 withSubviewAtIndex:3];
  }
      break;
  case 103:
  {
      CATransition *transition = [CATransition animation];
      transition.duration = 2.0f;
      // 使用kCATransitionReveal动画
      transition.type = kCATransitionReveal;
      // 指定动画方向，从上到下
      transition.subtype = kCATransitionFromLeft;
      [self.view.layer addAnimation:transition forKey:@"animation"];
      // 交换视图控制器所显示的UIView中中2个子控件位置
      [self.view exchangeSubviewAtIndex:2 withSubviewAtIndex:3];
  }
      break;
  case 104:
  {
      CATransition *transition = [CATransition animation];
      transition.duration = 2.0f;
      // 使用@"cube"动画
      transition.type = @"cube";
      // 指定动画方向，从左到右
      transition.subtype = kCATransitionFromLeft;
      [self.view.layer addAnimation:transition forKey:@"animation"];
      // 交换视图控制器所显示的UIView中中2个子控件位置
      [self.view exchangeSubviewAtIndex:2 withSubviewAtIndex:3];
  }
      break;
  case 105:
  {
      CATransition *transition = [CATransition animation];
      transition.duration = 2.0f;
      // 使用@"suck"动画, 该动画与动画方向无关
      transition.type = @"suckEffect";
      [self.view.layer addAnimation:transition forKey:@"animation"];
      // 交换视图控制器所显示的UIView中中2个子控件位置
      [self.view exchangeSubviewAtIndex:2 withSubviewAtIndex:3];
  }
      break;
  case 106:
  {
      CATransition *transition = [CATransition animation];
      transition.duration = 0.5f;
      // 使用@"oglFlip"动画
      transition.type = @"oglFlip";
      // 指定动画方向为上下翻转
      transition.subtype = kCATransitionFromTop;
      [self.view.layer addAnimation:transition forKey:@"animation"];
      // 交换视图控制器所显示的UIView中中2个子控件位置
      [self.view exchangeSubviewAtIndex:1 withSubviewAtIndex:3];
  }
      break;
  case 107:
  {
      CATransition *transition = [CATransition animation];
      transition.duration = 2.0f;
      // 使用@"rippleEffect"动画，该动画与方向无关
      transition.type = @"rippleEffect";
      [self.view.layer addAnimation:transition forKey:@"animation"];
      // 交换视图控制器所显示的UIView中中2个子控件位置
      [self.view exchangeSubviewAtIndex:2 withSubviewAtIndex:3];
  }
      break;
  default:
      break;

  } } 最终的实现效果是这样的 

iOS Controller中视图切换动画效果

标签：oid   视图切换   ges   UI   state   case   set   icon   nts   

原文地址：http://www.cnblogs.com/zimou47/p/6432810.html