iOS动画-2

#pragma mark------iOS动画

- (void)initAnimation{

/*-----------组动画CAAnimationGroup--------*/

/*

CAAnimation的子类,可以保存一组动画对象,将CAAnimationGroup对象加入层后,组中所有动画对象可以同时并发运行。

重要属性

animations: 用来保存一组动画对象的NSArray

*/

//    UIView* animationView = [[UIView alloc]init];

//    [self.view addSubview:animationView];

//    animationView.backgroundColor = [UIColor yellowColor];

//    animationView.frame = CGRectMake(screenWidth/2-25, screenHeight/2-25, 50, 50);

//

//    CAKeyframeAnimation* keyFrameAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];

//    NSValue* value1 = [NSValue valueWithCGPoint:CGPointMake(0, screenHeight/2-50)];

//    NSValue* value2 = [NSValue valueWithCGPoint:CGPointMake(screenWidth/3, screenHeight/2-50)];

//    NSValue* value3 = [NSValue valueWithCGPoint:CGPointMake(screenWidth/3, screenHeight/2+50)];

//    NSValue* value4 = [NSValue valueWithCGPoint:CGPointMake(screenWidth/3*2, screenHeight/2+50)];

//    NSValue* value5 = [NSValue valueWithCGPoint:CGPointMake(screenWidth/3*2, screenHeight/2-50)];

//    NSValue* value6 = [NSValue valueWithCGPoint:CGPointMake(screenWidth, screenHeight/2-50)];

//    keyFrameAnimation.values = [NSArray arrayWithObjects:value1,value2,value3,value4,value5,value6, nil];

//

//    //缩放动画

//    CABasicAnimation* basicAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];

//    basicAnimation.fromValue = [NSNumber numberWithFloat:0.1f];

//    basicAnimation.toValue = [NSNumber numberWithFloat:2.0f];

//

//    //旋转动画

//    CABasicAnimation* rotAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];

//    rotAnimation.toValue = [NSNumber numberWithFloat:4*M_PI];

//

//    //组动画

//    CAAnimationGroup* groupAnimation = [CAAnimationGroup animation];

//    groupAnimation.animations = [NSArray arrayWithObjects:keyFrameAnimation,basicAnimation,rotAnimation, nil];

//    groupAnimation.duration = 8.0f;

//    [animationView.layer addAnimation:groupAnimation forKey:@"groupAnimation"];

/*----------------------过渡动画CATransition------------------------------------------------*/

/*CATransition的子类,用于做过渡动画或者转场动画,能够为层提供移出屏幕和移入屏幕的动画效果

重要属性:type:动画过渡类型

Apple官方的SDK其实只提供了四种过渡效果

kCATransitionFade 渐变效果

kCATransitionMoveIn 进入覆盖效果

kCATransitionPush 推出效果

kCATransitionReveal 揭露离开效果

subtype:动画过渡方向

kCATransitionFromRight 从右侧进入

kCATransitionFromLeft 从左侧进入

kCATransitionFromTop 从顶部进入

kCATransitionFromBottom 从底部进入

startProgress:动画起点(在整体动画的百分比)

endProgress:动画终点(在整体动画的百分比)

*/

/*烟花效果🎆  使用的是一种比较特殊的动画---粒子动画*/

/*

一个粒子系统一般有两部分组成

1.CAEmitterCell:可以看作是单个粒子的原型,如:一个单一的粉扑在一团烟雾。当散发出一个粒子,UIKit根据这个发射粒子和定义的基础上创建一个随机粒子。此原型包括一些属性来控制粒子的图片,颜色、方向、运动,缩放比例和生命周期

2.CAEmitterLayer:主要控制发射源的位置、尺寸、发射模式、发射源的形状等等。他是一个高性能的粒子引擎,被用来创建复杂的粒子动画如:烟雾、火、雨等效果,并且很好的控制了性能

CAEmitterLayer就像大炮,决定了(1)哪里发射(2)大炮有多大

CAEmitterCell就像是炮弹,觉得了(1)初速度(2)加速度(3)炮弹类型(4)发射后的角度 等等

首先提醒CAEmitterLayer本身没有什么难度,主要在于两点:

属性较多(一会会把属性都列举出来,不知道了随时查阅就是)

调参数比较费时(想要有好的动画效果还得慢慢的去调整各项参数,不过没有难度就是有点费时间)

平常用的多的比如 emitterShape 的 kCAEmitterLayerLine 和 kCAEmitterLayerPoint。这两个从视觉上还是比较好区分的,这决定了你的粒子是从一个点「喷」出来的,还是从一条线上每个点「喷」下来,前者像焰火,后者像瀑布。显然,下雪的效果更像后者。

emitterMode 的 kCAEmitterLayerOutline 表示向外围扩散,如果你的发射源形状是 circle,那么 kCAEmitterLayerOutline 就会以一个圆的方式向外扩散开。

又比如你想表达一股蒸汽向上喷的效果,就可以设置 emitterShape 为 kCAEmitterLayerLine , emitterMode 为 kCAEmitterLayerOutline。

CAEmitterCell(炮弹)的属性

其实CAEmitterCell真是的名字叫粒子

3.

*/

/*总结--任何复杂的动画都是有一个个简单的动画组装的,只要我们善于分解和组装,就能实现满意的效果*/

/*一些常用的animationWithKeyPath值的总结

值 说明 使用形式

transform.scale 比例转化 @(0.8)

transform.scale.x 宽的比例 @(0.8)

transform.scale.y 高的比例 @(0.8)

transform.rotation.x 围绕x轴旋转 @(M_PI)

transform.rotation.y 围绕y轴旋转 @(M_PI)

transform.rotation.z 围绕z轴旋转 @(M_PI)

cornerRadius 圆角的设置 @(50)

backgroundColor 背景颜色的变化 (id)[UIColor purpleColor].CGColor

bounds 大小,中心不变 [NSValue valueWithCGRect:CGRectMake(0, 0, 200, 200)];

position 位置(中心点的改变) [NSValue valueWithCGPoint:CGPointMake(300, 300)];

contents 内容,比如UIImageView的图片 imageAnima.toValue = (id)[UIImage imageNamed:@"to"].CGImage;

opacity 透明度 @(0.7)

contentsRect.size.width 横向拉伸缩放 @(0.4)最好是0~1之间的

*/

/*---------背景颜色--------透明度-----------*/

//        UIView* animationView = [[UIView alloc]init];

//        [self.view addSubview:animationView];

//        animationView.backgroundColor = [UIColor blueColor];

//        animationView.frame = CGRectMake(screenWidth/2-25, screenHeight/2-25, 50, 50);

//

//        CABasicAnimation* backgroudColor = [CABasicAnimation animationWithKeyPath:@"backgroundColor"];//背景色

//        backgroudColor.fromValue = (id)[UIColor redColor].CGColor;

//        backgroudColor.toValue = (id)[UIColor yellowColor].CGColor;

//

//        CABasicAnimation* viewAplha = [CABasicAnimation animationWithKeyPath:@"opacity"];//透明度

//        viewAplha.fromValue = @(0.1);

//      viewAplha.toValue = @(0.7);

//

//        //组动画

//        CAAnimationGroup* groupAnimation = [CAAnimationGroup animation];

//        groupAnimation.animations = [NSArray arrayWithObjects:backgroudColor,viewAplha, nil];

//        groupAnimation.duration = 8.0f;

//        [animationView.layer addAnimation:groupAnimation forKey:@"groupAnimation"];

//

/*-----------------------------粒子动画-----------------------------------------------*/

CAEmitterLayer* snowEmitter = [CAEmitterLayer layer];//创建一个CAEmitterLayer--也就是大炮

snowEmitter.emitterPosition = CGPointMake(80, 180);//指定发射源的位置

snowEmitter.masksToBounds = NO;//不修改边界

//    snowEmitter.emitterSize = CGSizeMake(snowEmitter.frame.size.width/2.0, snowEmitter.frame.size.height/2.0);//指定发射源的大小

snowEmitter.emitterSize = CGSizeMake(screenWidth, screenHeight/2.0);//指定发射源的大小(也就是炮弹出现的区域)

snowEmitter.emitterShape = kCAEmitterLayerRectangle;//发射源的形状kCAEmitterLayerLine//kCAEmitterLayerCircle

snowEmitter.emitterMode = kCAEmitterLayerOutline;//发射源的模式

snowEmitter.contents =(id)[UIImage imageNamed:@"icon_payment@2x"].CGImage;

CAEmitterCell* snowFlake = [CAEmitterCell emitterCell];//创建CAEmitterCell

snowFlake.birthRate = 10.0;//每秒多少个

snowFlake.lifetime = 50.0;//存活时间

snowFlake.velocity = 10;//因为动画属于落体效果,所以我们只需要设置他在y方向上的加速度就行了。

snowFlake.velocityRange = 8;//初速度范围

snowFlake.yAcceleration = 20;//y方向的加速度

snowFlake.xAcceleration = 20;

snowFlake.alphaSpeed = -0.4;

snowFlake.emissionRange = 8*M_PI;//以锥形分布开的发射角度。角度用弧度制。粒子均匀分布在这个锥形范围内。

snowFlake.contents = (id)[UIImage imageNamed:@"icon_payment@2x"].CGImage;//cell的内容。通常是一个指针CGImageRef。

//    snowFlake.contents = (id)[UIColor redColor].CGColor;

snowFlake.scale = 0.5;//缩小

snowFlake.emissionLatitude = M_PI_2;//发射角度

snowFlake.color = [UIColor redColor].CGColor;

snowEmitter.emitterCells = [NSArray arrayWithObject:snowFlake];

[self.view.layer addSublayer:snowEmitter];//把粒子动画所添加的视图

}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 157,198评论 4 359
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 66,663评论 1 290
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 106,985评论 0 237
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,673评论 0 202
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 51,994评论 3 285
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,399评论 1 211
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,717评论 2 310
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,407评论 0 194
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,112评论 1 239
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,371评论 2 241
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,891评论 1 256
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,255评论 2 250
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,881评论 3 233
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,010评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,764评论 0 192
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,412评论 2 269
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,299评论 2 260

推荐阅读更多精彩内容