iPhone跳转的动画效果类型及实现方法 CATransition

实现iphone漂亮的动画效果主要有两种方法,一种是UIView层面的,一种是使用CATransition进行更低层次的控制,

第一种是UIView,UIView方式可能在低层也是使用CATransition进行了封装,它只能用于一些简单的、常用的效果展现,这里写一个常用的示例代码,供大家参考。

viewplaincopy to clipboardprint?

1.[UIView beginAnimations:@"Curl"context:nil];//动画开始   

2.[UIView setAnimationDuration:0.75];  

3.[UIView setAnimationDelegate:self];  

4.[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:myview cache:YES];  

5.[myview removeFromSuperview];  

6.[UIView commitAnimations];  

[UIViewbeginAnimations:@"Curl"context:nil];//动画开始[UIView setAnimationDuration:0.75];[UIView setAnimationDelegate:self];[UIViewsetAnimationTransition:UIViewAnimationTransitionCurlUp forView:myviewcache:YES];[myview removeFromSuperview];[UIView commitAnimations]; 

第二种方式相对复杂一些,但如果更好的进行控制,还是使用这种方法吧,基本使用方法可以看一下如下例子:

viewplaincopy to clipboardprint?

1.CATransition *animation = [CATransition animation];  

2.[animation setDuration:1.25f];  

3.[animation setTimingFunction:[CAMediaTimingFunction  

4.functionWithName:kCAMediaTimingFunctionEaseIn]];  

5.[animation setType:kCATransitionReveal];  

6.[animation setSubtype: kCATransitionFromBottom];  

7.[self.view.layer addAnimation:animation forKey:@"Reveal"];  

 

CATransition*animation = [CATransition animation];[animation setDuration:1.25f];[animationsetTimingFunction:[CAMediaTimingFunctionfunctionWithName:kCAMediaTimingFunctionEaseIn]];[animationsetType:kCATransitionReveal];[animation setSubtype:kCATransitionFromBottom];[self.view.layer addAnimation:animationforKey:@"Reveal"]; 

这里使用了setType与setSubtype组合,这使用个比较保险,因为他的参数就是官方API里定义的,他们的参数说明可以参考如下:

viewplaincopy to clipboardprint?

 

1.setType:可以返回四种类型:  

2.kCATransitionFade淡出  

3.kCATransitionMoveIn覆盖原图  

4.kCATransitionPush推出  

5.kCATransitionReveal底部显出来  

6.setSubtype:也可以有四种类型:  

7.kCATransitionFromRight;  

8.kCATransitionFromLeft(默认值)  

9.kCATransitionFromTop;  

10.        kCATransitionFromBottom  

setType:可以返回四种类型:kCATransitionFade淡出kCATransitionMoveIn覆盖原图kCATransitionPush推出kCATransitionReveal底部显出来setSubtype:也可以有四种类型:kCATransitionFromRight;kCATransitionFromLeft(默认值)kCATransitionFromTop;kCATransitionFromBottom 

 

还有一种设置动画类型的方法,不用setSubtype,只用setType

viewplaincopy to clipboardprint?

1.[animation setType:@"suckEffect"];  

[animationsetType:@"suckEffect"]; 

这里的suckEffect就是效果名称,可以用的效果主要有:

viewplaincopy to clipboardprint?

1.pageCurl   向上翻一页  

2.pageUnCurl 向下翻一页  

3.rippleEffect 滴水效果  

4.suckEffect 收缩效果,如一块布被抽走  

5.cube 立方体效果  

6.oglFlip 上下翻转效果  

pageCurl  向上翻一页pageUnCurl 向下翻一页rippleEffect 滴水效果suckEffect 收缩效果,如一块布被抽走cube 立方体效果oglFlip上下翻转效果 

最后再给出一种常用代码供大家参考。

viewplaincopy to clipboardprint?

1.// Curl the image up or down  

2.CATransition *animation = [CATransition animation];  

3.[animation setDuration:0.35];  

4.[animation setTimingFunction:UIViewAnimationCurveEaseInOut];  

5.if (!curled){  

6.//animation.type = @"mapCurl";  

7.animation.type = @"pageCurl";  

8.animation.fillMode = kCAFillModeForwards;  

9.animation.endProgress = 0.99;  

10.        } else {  

11.        //animation.type = @"mapUnCurl";  

12.        animation.type = @"pageUnCurl";  

13.        animation.fillMode = kCAFillModeBackwards;  

14.        animation.startProgress = 0.01;  

15.        }  

16.        [animation setRemovedOnCompletion:NO];  

17.        [view exchangeSubviewAtIndex:0 withSubviewAtIndex:1];  

18.        [view addAnimation:animation forKey"pageCurlAnimation"];  

19.        // Disable user interaction where necessary  

20.        if (!curled) {  

21.           

22.        } else {  

23.           

24.        }  

25.        curled = !curled;  

// Curl the image up or downCATransition *animation =[CATransition animation];[animation setDuration:0.35];[animationsetTimingFunction:UIViewAnimationCurveEaseInOut];if (!curled){//animation.type= @"mapCurl";animation.type =@"pageCurl";animation.fillMode =kCAFillModeForwards;animation.endProgress = 0.99;} else {//animation.type =@"mapUnCurl";animation.type =@"pageUnCurl";animation.fillMode = kCAFillModeBackwards;animation.startProgress= 0.01;}[animation setRemovedOnCompletion:NO];[view exchangeSubviewAtIndex:0withSubviewAtIndex:1];[view addAnimation:animationforKey"pageCurlAnimation"];// Disable user interaction wherenecessaryif (!curled) { } else { }curled = !curled; 

posted @ 2013-07-22 19:23  xinyuyuanm  阅读(232)  评论(0编辑  收藏  举报