先來看看後果：

上面進入正題，是時刻展示真實的技巧了：

起首在掌握器裡添加一個scrollView，再在scrollView上的對應地位上添加要展現的imageView(立方體視圖組)，固然也能夠放上其它子掌握器的view完成更多功效這個隨便不是重點

//*******添加scrollView*******
  [self createScrollView];

//******創立立方體視圖組******
  [self createCubicViewArray];

//添加視圖到scrollView上
  for (int i=0; i<_viewArray.count; i++) {

    UIImageView *transView=_viewArray[i];

    //視圖在scrollView上對應的地位
    transView.x=self.view.bounds.size.width * i;

監聽scrollView的滑動事宜，在這裡要先獲得到顯示的以後頁、上一頁、下一頁，然後讓這三個頁面同時做3DTransform變換

#pragma mark - scrollView滑動事宜
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{

  //以後頁數
  NSInteger currentPage=_currentPage;

  //以後視圖
  UIView *currentView=_viewArray[currentPage];

  //上一個視圖
  UIView *lastView=nil;

  if (currentPage-1>=0) {

    lastView=_viewArray[currentPage-1];
  }

  //下一個視圖掌握器視圖
  UIView *nextView;

  if (currentPage+1<=3) {

    nextView=_viewArray[currentPage+1];
  }

  //本次偏移間隔
  CGFloat currentOffset=scrollView.contentOffset.x-currentPage*self.view.bounds.size.width;

  //本次偏移角度
  CGFloat deltaAngle=currentOffset/self.view.bounds.size.width * M_PI_2;

  //****************以後視圖挪動幻化***************

  //設置錨點
  currentView.layer.anchorPoint=CGPointMake(0.5, 0.5);

  //向屏幕後方挪動
  CATransform3D move = CATransform3DMakeTranslation(0, 0, self.view.bounds.size.width/2);

  //扭轉
  CATransform3D rotate = CATransform3DMakeRotation(-deltaAngle, 0, 1, 0);

  //平移
  CATransform3D plaintMove=CATransform3DMakeTranslation( currentOffset, 0, 0);

  //向屏幕前方挪動
  CATransform3D back = CATransform3DMakeTranslation(0, 0, -self.view.bounds.size.width/2);

  //銜接
  CATransform3D concat=CATransform3DConcat( CATransform3DConcat(move, CATransform3DConcat(rotate, plaintMove)),back);

  CATransform3D transform=CATransform3DPerspect(concat, CGPointMake(currentOffset/2, self.view.bounds.size.height), 5000.0f);

  //添加幻化殊效
  currentView.layer.transform=transform;

  //****************下一個視圖挪動幻化***************

  //設置錨點
  nextView.layer.anchorPoint=CGPointMake(0.5, 0.5);

  //向屏幕後方挪動
  CATransform3D move2 = CATransform3DMakeTranslation(0, 0, self.view.bounds.size.width/2);

  //扭轉
  CATransform3D rotate2 = CATransform3DMakeRotation(-deltaAngle+M_PI_2, 0, 1, 0);

  //平移
  CATransform3D plaintMove2=CATransform3DMakeTranslation( currentOffset-self.view.bounds.size.width, 0, 0);

  //向屏幕前方挪動
  CATransform3D back2 = CATransform3DMakeTranslation(0, 0, -self.view.bounds.size.width/2);

  //拼接
  CATransform3D concat2=CATransform3DConcat( CATransform3DConcat(move2, CATransform3DConcat(rotate2, plaintMove2)),back2);

  CATransform3D transform2=CATransform3DPerspect(concat2, CGPointMake(self.view.bounds.size.width/2+currentOffset/2, self.view.bounds.size.height), 5000.0f);

  //添加幻化殊效
  nextView.layer.transform=transform2;

  //****************上一個視圖挪動幻化***************

  //設置錨點
  lastView.layer.anchorPoint=CGPointMake(0.5, 0.5);

  //向屏幕後方挪動
  CATransform3D move3 = CATransform3DMakeTranslation(0, 0, self.view.bounds.size.width/2);

  //扭轉
  CATransform3D rotate3 = CATransform3DMakeRotation(-deltaAngle-M_PI_2, 0, 1, 0);

  //平移
  CATransform3D plaintMove3=CATransform3DMakeTranslation( currentOffset+self.view.bounds.size.width, 0, 0);

  //向屏幕前方挪動
  CATransform3D back3 = CATransform3DMakeTranslation(0, 0, -self.view.bounds.size.width/2);

  //拼接
  CATransform3D concat3=CATransform3DConcat(CATransform3DConcat(move3, CATransform3DConcat(rotate3, plaintMove3)),back3);

  CATransform3D transform3=CATransform3DPerspect(concat3, CGPointMake(-self.view.bounds.size.width/2+currentOffset/2, self.view.bounds.size.height), 5000.0f);

  //添加幻化殊效
  lastView.layer.transform=transform3;
}

這裡記得要回復復興一下3D變換，否則滑快了會湧現頁面紊亂

-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{

  //轉變選中頁序號
  [self changeIndex];

  //3D幻化恢回復復興狀況
  for (UIView * view in _viewArray) {

    view.layer.transform=CATransform3DIdentity;
  }
}

對了，記得添加一個很主要的透視變換函數，焦點在於仿射矩陣的m34屬性，如許才會發生遠小近年夜的3D後果，讓動畫更炫酷

//3D透視函數
CATransform3D CATransform3DMakePerspective(CGPoint center, float disZ)
{
  CATransform3D transToCenter = CATransform3DMakeTranslation(-center.x, -center.y, 0);
  CATransform3D transBack = CATransform3DMakeTranslation(center.x, center.y, 0);
  CATransform3D scale = CATransform3DIdentity;
  scale.m34 = -1.0f/disZ;
  return CATransform3DConcat(CATransform3DConcat(transToCenter, scale), transBack);
}

這一篇文章就到這裡了，年夜家有甚麼看法和成績記得實時反應，願望本文對年夜家開辟IOS有所贊助。

【iOS動畫殊效之立方體翻轉】的相關資料介紹到這裡，希望對您有所幫助！ 提示：不會對讀者因本文所帶來的任何損失負責。如果您支持就請把本站添加至收藏夾哦！