zoukankan      html  css  js  c++  java
  • CAEmitterLayer实现雪花效果

    CAEmitterLayer 简介

    在iOS5.0中,Apple引入了CAEmitterLayer层,CAEmitterLayer是一个高性能的粒子效果引擎,被用来创建实时粒子动画,如:烟雾,火,雨等效果。CAEmitterLayer其实是一个粒子容器,负责按照开发者的设定,成产出一个或者多个粒子样式,然后将其模板化并大量生产。

    实例:雪花效果

    如果大家突然需要一个雪花效果,我相信大部分人的第一反应是使用定时器创建大量的ImageView对象,然后给每个ImageView对象添加动画。这种做法一方面操作复杂,一方面性能方面堪忧.既然现在大家都了解了CAEmitterLayer引擎,因此下面使用CAEmitterLayer引擎实现这个效果,看下其的便捷性和性能方面的优势。

    1.创建一个CAEmitterLayer对象

    CAEmitterLayer *emitter = [CAEmitterLayer layer];
    emitter.frame = self.view.bounds;
    [self.containerView.layer addSublayer:emitter];
    emitter.renderMode = kCAEmitterLayerAdditive;
    emitter.emitterPosition = CGPointMake(emitter.frame.size.width / 3.0, -75);
    

    该layer的创建方式与基本CALayer层没什么区别,区别在于属性,下面将会简要介绍:

    • rederMode:控制着在视觉上粒子图片是如何混合的。我们在实例中设置为了KCAEmitterLayerAdditive,它表示这:合并粒子重叠部分的亮度使其更加明亮,其他效果可以尝试下。
    • emitterPosition:表示粒子发射器的中心位置

    注意:CAEmitterLayer的属性控制着整个粒子系统的位置和形状,一些属性比如birthRate在粒子模板中也有。这些属性会以相乘的方式作用在一起。

    2.创建一个粒子模板

    CAEmitterCell *cell = [[CAEmitterCell alloc] init];
    cell.contents = (__bridge id)[UIImage imageNamed:@"面板_雪花"].CGImage;
    cell.birthRate = 5;
    cell.lifetime =7.0 ;
                cell.alphaSpeed = 0;
    cell.velocity = 150;
    cell.velocityRange = 100;
    cell.emissionLongitude = M_PI / 2;
    cell.emissionRange = M_PI /2 ;
    emitter.emitterCells = @[cell];
    

    值得一提的属性如下介绍:

    • birthRate:表示粒子的生产速度,值越大,生产的速度越大
    • lifetime:表示粒子的生命周期,在该范围内,粒子不会消失(当然,透明度可能也会让粒子显示出消失的效果)
    • alphaSpeed:粒子透明度的变化速度,为负值时说明透明度慢慢变低
    • velocity:表示粒子的位移加速度
    • velocityRange:表示粒子的位移加速范围 与上一个参数配合使用
    • emissionLongitude:粒子发射中心方向
    • emissionRange:粒子发射范围

    其他配置

    我们按照上面的方法创建两个发射源,放在视图的顶部,设置雪花飘落的范围与方向,然后给视图配置一个美感的背景图,就可以实现一个雪花效果了。而且,我们做的工作其实很少,性能也有大大的提高。不多说,看效果

  • 相关阅读:
    toncat配置文件 简单飞扬
    Magic eDeveloper 学习 简单飞扬
    网站即时通信 简单飞扬
    客户端代码 简单飞扬
    聊天工具代码 简单飞扬
    数据库连接 简单飞扬
    HTML frameset 标签 简单飞扬
    自动递归删除 简单飞扬
    magic 简单飞扬
    Coherence Step by Step 目录
  • 原文地址:https://www.cnblogs.com/ToBeTheOne/p/5762389.html
Copyright © 2011-2022 走看看