IOS动画效果源代码整理(粒子、雪花、火焰、河流、蒸汽)

学习神奇的粒子发射器,雪花纷纷落下的动画效果,就是通过CAEmitterLayer来实现的,这个layer还能创建火焰,河流,蒸汽的动画效果,常用于游戏开发。

Creating your emitter layer

let rect = CGRect(x: 0.0, y: -70.0, width: view.bounds.width, height: 50.0)
let emitter = CAEmitterLayer()
emitter.backgroundColor = UIColor.blueColor().CGColor
emitter.frame = rect
emitter.emitterShape = kCAEmitterLayerRectangle
view.layer.addSublayer(emitter)

代码创建了CAEmitterLayer,并设置了发射源形状emitterShape。

有几个常用的emitterShape:

kCAEmitterLayerPoint:使所有粒子在同一点创建发射器的位置。这是一个很好的选择用于火花或烟花,比如,你可以创建一个火花效应,通过创建所有的粒子在同一点上,使它们在不同的方向飞,然后消失。

kCAEmitterLayerLine:所有粒子沿发射架顶部的顶部。这是一个用于瀑布效应的发射极的形状;水粒子出现在瀑布的顶部边缘。

kCAEmitterLayerRectangle:创建粒子随机通过一个给定的矩形区域。

Adding an emitter frame

前面是设置了layer Frame,下面设置layer里面的Emitter的frame

emitter.emitterPosition = CGPoint(x: rect.width * 0.5, y: rect.height * 0.5)
emitter.emitterSize = rect.size

代码设置了Emitter中心点是layer的中心点,size和layer一样。

[]Creating an emitter cell

现在,您已经配置了发射器的位置和大小,可以继续添加Cell。 Cell是表示一个粒子源的数据模型。是CAEmitterLayer一个单独的类,因为一个发射器可以包含一个或多个粒子。 例如,在一个爆米花动画,你可以有三种不同的细胞代表一个爆米花的不同状态:完全炸开,一半炸开和没有炸开:

let emitterCell = CAEmitterCell()
emitterCell.contents = UIImage(named: "flake.png")!.CGImage
emitterCell.birthRate = 20
emitterCell.lifetime = 3.5
emitter.emitterCells = [emitterCell]

代码每一秒创建20个cell,每个cell有3.5s的生命周期,之后一些cell就会消失

[]Controlling your particles

上面设置的cell不会动,需要给它个加速度

emitterCell.xAcceleration = 10.0
emitterCell.yAcceleration = 70.0

设置Cell在X轴,Y轴的加速度。

emitterCell.velocity = 20.0
// x-y平面的发射方向
// -M_PI_2 垂直向上
emitterCell.emissionLongitude = CGFloat(-M_PI_2)

设置起始速度,发射的方向是通过emissionLongitude属性定义的。

[]Adding randomness to your particles

emitterCell.velocityRange = 200.0

设置其实速度的随机范围,每个粒子的速度将是一个随机值之间(20-200)= 180 ~(20 + 200)= 220。负初始速度的粒子不会向上飞,一旦出现在屏幕上,他们就会开始浮动。带正速度的粒子先飞起来,然后再浮。

emitterCell.emissionRange = CGFloat(M_PI_2)

原来,你配置的所有粒子射直线上升(π/ 2角)作为他们的出现。上面这行代码表示为每个粒子随机选一个发射角度在(-π/2 + π/2)= 180度(-π/ 2 +π/2)= 0度之间。

[]Changing particle color

设置你的粒子颜色

emitterCell.color = UIColor(red: 0.9, green: 1.0, blue: 1.0, alpha: 1.0).CGColor

还可以设置粒子的颜色RGB范围:

emitterCell.redRange = 0.1
emitterCell.greenRange = 0.1
emitterCell.blueRange = 0.1

由于RGB最大为1.0,所以red是取值0.81.0,green:0.91.0,blue:0.9~1.0

[]Randomizing particle appearance

之前的粒子都是一样大的,这里给粒子分配一个随机大小。

emitterCell.scale = 0.8
emitterCell.scaleRange = 0.8

设置粒子是原来的80%大小,随机范围是从0.0到1.6。

emitterCell.scaleSpeed = -0.15

粒子每秒钟按15%的体积缩小。
还可以设置透明度

emitterCell.alphaRange = 0.75
emitterCell.alphaSpeed = -0.15

透明度 0.25~1.0,每秒透明度减少15%。

(0)

相关推荐

  • IOSdrawRect实现雪花飘落效果

    本文实例为大家分享了IOSdrawRect实现雪花飘落效果的具体代码,供大家参考,具体内容如下 绘制原理: 雪花效果最主要的思路就是在于循环产生带雪花图片的imageView, 产生的雪花的imageview的 x.y.宽.下落的速度都是随机的,这个可以用随机数来产生数据. 实现代码: #import <UIKit/UIKit.h> @interface HHFSnowflakeFallingView : UIView /** * 快速创建一个雪花飘落效果的view * * @param bg

  • iOS实现大雪纷飞动画

    本文实例为大家分享了iOS实现大雪纷飞动画的具体代码,供大家参考,具体内容如下 1.结果展示 美丽的雪花,勾起了多少美好的回忆. 2.制作思路 其实创作这样一个大学纷飞的场景是十分简单的,简单到你看了教程之后想不会都不行.OK,下面国际惯例,讲解一下思路吧. 1.创建一个数组用来保存大量的雪花 _imagesArray = [[NSMutableArray alloc] init]; for (int i = 0; i < 1000; ++ i) { UIImageView *imageView

  • IOS动画效果源代码整理(粒子、雪花、火焰、河流、蒸汽)

    学习神奇的粒子发射器,雪花纷纷落下的动画效果,就是通过CAEmitterLayer来实现的,这个layer还能创建火焰,河流,蒸汽的动画效果,常用于游戏开发. Creating your emitter layer let rect = CGRect(x: 0.0, y: -70.0, width: view.bounds.width, height: 50.0) let emitter = CAEmitterLayer() emitter.backgroundColor = UIColor.b

  • iOS CAEmitterLayer实现粒子发射动画效果

    iOS实现粒子发射动画效果图 代码已上传 GitHub:https://github.com/Silence-GitHub/CoreAnimationDemo 动画效果用 CAEmitterLayer 实现.CAEmitterLayer 显示粒子发射动画,具体的粒子由 CAEmitterCell 封装.代码示例是展示 CAEmitterLayer 如何使用.为了方便,直接在控制器(UIViewController)中设置 CAEmitterLayer.如果在项目中使用,有时在自定义视图(UIVi

  • iOS中利用CAEmitterLayer实现粒子动画详解

    前言 你肯定见过很酷炫的iOS动画吧,例如微信的表情雨

  • IOS等待时动画效果的实现

    查询时间或长或短,为了提升用户体验,目前用的比较多的手段之一就是查询等待时添加一个动态等待效果.当我们在请求网络时加载页面时有个动作效果,效果图如下: 源代码可以网上找开源项目Coding.net,上面的效果原理为两张图片组合,外面那个则为动画转动,里面的图标则是透明度的变化:主要代码如下: 1:把它封装在EaseLoadingView里面 @interface EaseLoadingView : UIView @property (strong, nonatomic) UIImageView

  • iOS利用UIBezierPath + CAAnimation实现路径动画效果

    前言 上次给大家介绍了iOS利用UIBezierPath + CAAnimation实现路径动画效果的相关内容,今天实现一个根据心跳路径实现一个路径动画,让某一视图沿着路径进行运动.. 效果图如下: 核心代码 1-首先通过 drawRect 绘制心形路径 - (void)drawRect:(CGRect)rect { // Drawing code // 初始化UIBezierPath UIBezierPath *path = [UIBezierPath bezierPath]; // 首先设置

  • iOS 动画 —— 礼花效果实例详细

    CAEmitterLayer 提供了一个基于 Core Animation 的粒子发射系统,使用它可以实现各种各样的粒子动画效果.此处的礼花效果,就是基于 CAEmitterLayer 的. fire.gif - (void)viewDidLoad { [super viewDidLoad]; [self makeFireworksDisplay]; } - (void)makeFireworksDisplay { // 粒子发射系统 的初始化 CAEmitterLayer *fireworks

  • iOS动画案例(1) 类似于qq账号信息里的一个动画效果

    受人所托,做一个类似于qq账号信息里的一个动画,感觉挺有意思,也没感觉有多难,就开始做了,结果才发现学的数学知识都还给体育老师了,研究了大半天才做出来. 先看一下动画效果: 用到的知识点: (1)三角函数 (2)CALayer (3)CATransaction (4)UIBezierPath (5)CAKeyframeAnimation (6)CAAnimationGroup 如图,这明显是一段圆弧,那么要确定这段一段圆弧的位置,就得确定这段圆弧的圆心和圆心角.我规定圆心在手机屏幕的左顶点,也就

  • iOS 屏幕解锁文字动画效果

    CAGradientLayer相信大家都比较熟悉,关于其如何使用,我就不在这里废话了,网上有很多介绍,想详细了解的话,可以去看看.我只简单说下如何利用CAGradientLayer制作屏幕解锁文字动画效果. 1.创建一个CAGradientLayer对象gradLayer,设置它的frame和label.bounds一样(这里要注意一下是Label的bounds不是frame); 2.这里我给gradLayer.colors一共设置了三个颜色值,首尾颜色透明度设置成0.3,中间的颜色值透明度保持

  • iOS中给自定义tabBar的按钮添加点击放大缩小的动画效果

    之前想过一些通过第三方的方式实现动画,感觉有点麻烦,就自己写了一个 不足之处还望大家多多指出 // 一句话,写在UITabBarController.m脚本中,tabBar是自动执行的方法 // 点击tabbarItem自动调用 -(void)tabBar:(UITabBar *)tabBar didSelectItem:(UITabBarItem *)item { NSInteger index = [self.tabBar.items indexOfObject:item]; [self a

  • iOS 基本动画、关键帧动画、利用缓动函数实现物理动画效果

    iOS基本动画/关键帧动画/利用缓动函数实现物理动画效果 先说下基本动画部分 基本动画部分比较简单, 但能实现的动画效果也很局限 使用方法大致为: #1. 创建原始UI或者画面 #2. 创建CABasicAnimation实例, 并设置keypart/duration/fromValue/toValue #3. 设置动画最终停留的位置 #4. 将配置好的动画添加到layer层中 举个例子, 比如实现一个圆形从上往下移动, 上代码: //设置原始画面 UIView *showView = [[UI

随机推荐