美文网首页
粒子引擎 CAEmitterLayer 和 CAEmitterC

粒子引擎 CAEmitterLayer 和 CAEmitterC

作者: MeteorCode | 来源:发表于2017-10-16 18:13 被阅读56次
    • 效果:通过CAEmitterLayer和CAEmitterCell的配合使用,可以实现很多意想不到的动画效果。如:烟雾,火,雨等动画效果

    • 粒子引擎两个层面

    控件 层面 作用
    CAEmitterLayer 发射层(整体) 发射层的 形状、发射位置、发射源(尺寸、发射的模式)
    CAEmitterCell 粒子层(个体) 粒子的 图片,颜色方向、运动、缩放比例、生命周期

    CAEmitterCell

    CAEmitterCell 是粒子的原型,通过设置对粒子的属性配置,可以改变粒子的图片,颜色,方向,运动,缩放比例和生命周期等;

    • CAEmitterCell 的属性
    name: 标识
    birthRate:产生频率;/秒
    lifetime:生命周期,即在屏幕上显示多长时间;秒
    lifetimeRange:生命周期范围
    alphaSpeed:粒子透明度在生命周期内的改变速度
    alphaRange:  一个粒子的颜色透明度alpha能改变的范围
    velocity:运动速度
    velocityRange:运动速度的浮动值
    xAcceleration:x方向的加速度
    yAcceleration:y方向的加速度
    zAcceleration:z方向的加速度
    spin:自旋转角度
    spinRange:自旋转角度范围
    emissionRange;抛洒角度的浮动值
    contents:内容,一般都是图片
    contentsRect:内容frame
    contentsScale:内容缩放比例
    
    scale:缩放比例,缩小 < 1 < 放大 
    scaleRange:缩放比例范围
    scaleSpeed:缩放比例速度;
    minificationFilter:减小自己的大小;
    minificationFilterBias:减小大小的因子;
    enabled:粒子是否被渲染
    emissionLatitude:发射的z轴方向的角度;
    emissionLongtitude:x-y平面的发射方向;
    emitterCells:粒子发射的粒子
    

    CAEmitterLayer

    CAEmitterLayer 是高性能的粒子引擎,主要是定义粒子原型发射层的形状和发射位置,发射源的尺寸以及发射的模式等。

    • CAEmitterLayer 属性
    emitterPosition   发射源的中心点 - CGPoint
    emitterSize       发射源的尺寸 - CGSize
    emitterShape      发射源的形状 -  点、线、矩形、圆形
    emitterMode       发射源的模型 - 顶点、边缘、表面、3D
    
    • emitterShape 形状枚举
     NSString * const kCAEmitterLayerPoint               点
     NSString * const kCAEmitterLayerLine                线
     NSString * const kCAEmitterLayerRectangle           矩形
     NSString * const kCAEmitterLayerCuboid              3D rectangle
     NSString * const kCAEmitterLayerCircle              圆形
     NSString * const kCAEmitterLayerSphere              3D circle
    
    • emitterPosition 和 emitterSize 的介绍
    图形 emitterPosition 中心点 emitterSize 宽高
    点,宽高忽略,可以不设置这个属性
    线 中点 线,忽略高
    圆心 宽高决定圆的直径
    矩形 对角线交点 宽高
    • emitterMode 发射模型枚举
    NSString * const kCAEmitterLayerPoints;      顶点
    NSString * const kCAEmitterLayerOutline;     边缘上
    NSString * const kCAEmitterLayerSurface;     表面
    NSString * const kCAEmitterLayerVolume;      容积,立体图形内
    

    在确定粒子的中心点,形状,宽高后, emitterMode 发射模型可以进一步确认粒子是从图形的哪个具体位置发射出来的;

    举例:

    发射形状 发射模型 发射位置
    矩形 顶点 四个角的点
    / 边缘 四条边上的所有点
    / 表面 表面上的均匀的点
    圆形 顶点 圆心那个点

    注意:只有3d的图形才有容积;

    • 代码展示
    CAEmitterCell:
    
    - (CAEmitterCell *)makeEmitterCellRate:(CGFloat)rate {  //CAEMitterCell 属性设置
        
        CAEmitterCell *cell = [CAEmitterCell new];
        cell.birthRate = 20 * rate; // 每秒生成粒子的个数
        cell.velocity = 40; // 粒子运动的速度均值
        cell.lifetime = [self randFloatBetween:0.3 and:0.75]; // 粒子生命周期
        cell.lifetimeRange = [self randFloatBetween:0.6 and:1.5]; //生命周期范围
        cell.contents = (id)[[self imgWithSize:CGSizeMake(10 * rate, 10 * rate)] CGImage]; //设置图片
        cell.emissionLongitude = DEGREES_TO_RADIANS(60); //x-y平面的发射方向
        cell.emissionRange = M_PI_4 * 0.5 * rate; // 粒子发射角度, 这里是一个扇形
        cell.yAcceleration = 10; // 粒子y方向的加速度分量
        cell.xAcceleration = -10;//粒子x方向的加速度分量
        cell.scale = 0.4; //缩放比例
        cell.alphaSpeed = -0.3f;  // 粒子消逝的速度
        
        return cell;
    }
    
    CAEmitterLayer:
    
        UIView *animationView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
        [self insertSubview:animationView atIndex:0];
        
        CAEmitterLayer *snowLayer = [CAEmitterLayer layer];
        snowLayer.emitterPosition = CGPointMake(0, 0);//发射位置
        snowLayer.emitterSize = CGSizeMake(self.view.bounds.size.width * 2, 1); //发射源的尺寸
        snowLayer.emitterMode = kCAEmitterLayerOutline;//发射源的模型 - 表面
        snowLayer.emitterShape = kCAEmitterLayerRectangle; //发射源的形状 - 线
        snowLayer.shadowOpacity = 0.7;
        snowLayer.shadowColor = [UIColor whiteColor].CGColor;
        
        CAEmitterCell *cell = [self makeEmitterCellRate:rate];
       
        snowLayer.emitterCells = @[cell];
        [animationView.layer addSublayer:snowLayer];
    

    相关文章

      网友评论

          本文标题:粒子引擎 CAEmitterLayer 和 CAEmitterC

          本文链接:https://www.haomeiwen.com/subject/rfcluxtx.html