开发常用动画收集

现在的位置: 首页 > 综合 > 正文

RSS

开发常用动画收集

2018年07月29日 ⁄ 综合 ⁄ 共 7651字 ⁄ 字号小中大 ⁄ 评论关闭

一、UIView 动画

使用iPhone作为开发平台，你可以体验到UIView带来的既另类又有趣的动画功能。UIView动画能够完美地建立起一座连接视图当前状态和未来状态地视觉桥梁。可以产生动画效果的变化包括:

1、位置变化:在屏幕上移动视图；

2、大小变化:改变视图框架和边界；

3、拉伸变化:改变视图内容的延伸区域；

4、改变透明程度:改变视图的alpha值；

5、改变状态:隐藏或显示状态；

6、改变视图顺序:哪个视图显示在前，哪个在后；

7、旋转:换句话说，就是任何应用到视图上的仿射变换。

UIView动画是成块运行的，也就是说作为完整的事务一次性运行。发出beginAnimations: context:请求开启一个动画块。commitAnimations结束一个动画块。注意: 把这两个类方法发送给UIView而不是发送给单独的视图。同时在这两个调用之间的块中，添加动画的展现方式并更新视图。你可以使用以下步骤创建UIView动画。

(1)调用beginAnimations : context方法开启一个动画块；

(2)调用setAnimationCurve方法定义动画加速和减速方式；

(3)调用setAnimationDuration方法设定动画时长；

(4)自定义动画效果；

(5)调用commitAnimations方法结束你的动画块。

你可以设置动画委托，通知它在你的动画开始或结束的时候调用相应的回调方法。例如:

 [UIView setAnimationDelegate:self];
 [UIView setAnimationDidStopSelector:@selector(doSomething)];

下面是一些常用的UIView过渡动画：

a、下翻页过渡

    CGContextRef context = UIGraphicsGetCurrentContext();
    [UIView beginAnimations:nil context:context];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:0.7];
    [UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:self.view cache:YES];
    // do something here
    
    [UIView commitAnimations];

b、上翻页过渡

    CGContextRef context = UIGraphicsGetCurrentContext();
    [UIView beginAnimations:nil context:context];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:0.7];
    [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.view cache:YES];
    // do something here
    
    [UIView commitAnimations];

c、页面左转过渡

CGContextRef context = UIGraphicsGetCurrentContext();
    [UIView beginAnimations:nil context:context];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:0.7];
    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self.view cache:YES];
    // do something here
    
    [UIView commitAnimations];

d、页面右转过渡

    CGContextRef context = UIGraphicsGetCurrentContext();
    [UIView beginAnimations:nil context:context];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:0.7];
    [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.view cache:YES];
    // do something here
    
    [UIView commitAnimations];

二、Core Animation动画

除了UIView动画以外，Core Animation API可为iPhone应用程序提供高度灵活的动画解决方案。Core Animation Transitions仅在实现中做了几个小小的变动便丰富了UIView动画的内涵。注意:CATransition只针对图层，不针对视图。图层是Core Animation与每个UIView产生联系的工作层面。使用Core Animation时，应该将CATransition应用到视图的默认图层([myView
layer])而不是视图本身。建立的CA动画步骤如下:

(1)建立CA对象；

(2)设置它的参数；

(3)把这个带着参数的过渡添加到图层。

CA动画使用了类型和子类型两个概念。类型指定了过渡的种类，子类型设置了过渡的方向。对类型和子类型应用动画时，它们一起描述了视图应该怎么样完成过渡。

Core Animation是QuartzCore框架的一个组成部分，因此你必须将Quartz Core框架添加到项目中，并在使用这些功能时将<QuartzCore/QuartzCore.h>包含进你的代码中。

下面是一些常用的CA过渡动画:

a、淡化(fade)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = kCATransitionFade;
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

b、推挤(push)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = kCATransitionPush;
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

c、揭开(reveal)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = kCATransitionReveal;
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

d、覆盖(moveIn)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = kCATransitionMoveIn;
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

e、立方体翻转(cube)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = @"cube";
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

f、吸收(suckEffect)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = @"suckEffect";
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

g、翻转(oglFlip)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = @"oglFlip";
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

h、水波纹(rippleEffect)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = @"rippleEffect";
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

i、翻页(pageCurl)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = @"pageCurl";
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

j、反翻页(pageUnCurl)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = @"pageUnCurl";
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

k、镜头开(cameraIrisHollowOpen)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = @"cameraIrisHollowOpen";
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

l、镜头关(cameraIrisHollowClose)

CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 0.7;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = @"cameraIrisHollowClose";
animation.subtype = kCATransitionFromLeft;
/*
 kCATransitionFromLeft:    从左至右
 kCATransitionFromBottom:  下下至上
 kCATransitionFromRight:   从右至左
 kCATransitionFromTop:     从上至下
 */
// do something here
    
[[self.view layer] addAnimation:animation forKey:@"animation"];

【上篇】循环引用导致内存泄漏
【下篇】Xcode中使用svn时，报证书验证错误Error validating server certificate for

作者: thoracic

该日志由 thoracic 于6年前发表在综合分类下，最后更新于 2018年07月29日.
转载请注明: 开发常用动画收集 | 学步园 +复制链接

抱歉!评论已关闭.

学步园

开发常用动画收集

作者: thoracic

书签

最新文章New

本站推荐

返回首页