zhengxiangyu 发表于 2018-10-10 22:50:26

粒子图层说明

本帖最后由 郑翔宇er 于 2018-10-11 20:47 编辑

一、粒子图层说明        自SDK 6.5.0起,SDK提供一套粒子图层,这套粒子图层不仅可以实现雨天、雪天和雾霾天的效果,还可以通过用户自定义实现烟花爆炸和飞线等常见粒子特效,能满足需求且给用户很大的发挥空间。
https://cdn.nlark.com/lark/0/2018/png/55560/1536662080902-9af70821-d5b4-42ae-af06-c0c5aee86e9b.png    https://cdn.nlark.com/lark/0/2018/png/55560/1536662207920-c5b1f9e0-1146-47d4-809a-89520e25191f.png
二、实现方案
粒子图层由多个粒子按照给定运动方式组成的效果

1、图层基本属性   
    持续时长、最大粒子数量、是否可以循环
    最大粒子数量指的是支持的最大粒子数,主要是为性能考虑,建议不要太高
    如果设置为不可循环,粒子会在执行完一个生命周期后消失

2、初始状态设置
(1)初始的速度、初始的颜色、粒子图标

https://cdn.nlark.com/lark/0/2018/png/55560/1539085583485-eae49ff2-5e25-45e5-bfb7-fdcde4ce0863.png
    如图所示,将粒子设置为心形图标,图标大小可以自定义通过 setStartParticleSize 设置,单位是像素,值得注意的是这里的大小和图片原始大小无关,太大的图片也会被压缩成指定的大小(图中设定大小为64x64)
    每个粒子都有一个自己的方向和旋转角度(图中只给出了部分示意),通过不同的方向和不同的速度可以实现一个发散的效果,如下雨便是将所有的粒子方向设置为从上到下。(速度还可以设置为0,太阳效果便是设置速度为0)SDK中RandomVelocityBetweenTwoConstants 提供了随机生成速度的方法
    可以看见图标之间颜色不一样,这是通过设置粒子发射时的颜色设置,图中是设置一个随机的区间,每次颜色在区间内随机选取。SDK中RandomColorBetWeenTwoConstants 提供了随机生成颜色的方法

(2)发射率

https://cdn.nlark.com/lark/0/2018/png/55560/1539085469780-cfa90345-2609-4f0f-9556-1280b805662a.pnghttps://cdn.nlark.com/lark/0/2018/png/55560/1539085463034-e04eabc7-bf11-403d-a3c0-240f210834db.png   可以看见这两张图的区别是,其中一张比较密集,这是有发射率导致的,发射率的意思是每秒钟发射多少个粒子,如果每秒发射一个就是左边的情况,而右边是每秒20个(注:控制台是为了调试方便添加的,时机粒子效果覆盖物中不存在控制台)。SDK中 ParticleEmissionModule 提供了发射率设置的方法。
   值得注意的是,发射率会收到粒子图层时长和最大数量的限制,比如每秒发射20个粒子,粒子时长为5s最大支持50个粒子,则在第3s粒子会达到60个,此时因为超过了最大数量,后2s都不会产生粒子,待有粒子消失后才会产生新的粒子。

(3)粒子时长
每个粒子都有一个存在的时间,时间过了就会消失。消失后又会有新的粒子产生,从而达到粒子不断连绵不断的效果。

(4)发射区域
    上面图中展示的点都从左上角发出,但下雨下过是从屏幕上方发射



https://cdn.nlark.com/lark/0/2018/jpeg/55560/1539084614762-737fb100-ba61-454a-96ba-f83f596a7ad3.jpeg https://cdn.nlark.com/lark/0/2018/jpeg/55560/1539084621845-a4af4fc1-47a1-436a-a432-47a12626af73.jpeg    图中两者的差异在发射区域不同,左图是一个点,右图为一个矩形,下雨和下需的效果发射区域都和右图类似
    发射区域坐标原点为左上角,包含两种形式,一种是指定像素点如(100,100)表示距离左上角各100像素的位置。另一种是按比例计算,屏幕从左到右为,从上到下也是,对于选择屏幕中心点比较方便,均使用(0.5,0.5)即可,具体参数可以构造函数中进行旋转;SDK中通过setParticleShapeModule设置发射区域,SinglePointParticleShape为指定点发射 RectParticleShape为区域发射

3、运行状态    根据运行的时间去修改粒子的位置、方向、旋转角度、大小以及颜色

https://cdn.nlark.com/lark/0/2018/png/55560/1539080254181-c1537c2b-422d-4472-adff-cadd9932c198.png https://cdn.nlark.com/lark/0/2018/png/55560/1539080147071-b9a7bbb3-cc13-4548-831f-bbefaaafcc66.png    图中对粒子生命周期内旋转角度和缩放进行了修改,左边仅修改了缩放,粒子会越来越大,右边同时修改了缩放和旋转,会旋转着变大,通过这两条可以实现很多特效。SDK中通过setParticleOverLifeModule设置运行过程中的状态变化,状态变化包含四种速度、颜色、旋转角度、缩放大小均可以在ParticleOverLifeModule中进行设置。

三、示例代码
com.amap.api.maps.model.particle.ParticleOverlayOptions particleSystemOptions = new com.amap.api.maps.model.particle.ParticleOverlayOptions();
particleSystemOptions.icon(BitmapDescriptorFactory.fromResource(R.drawable.heart280));

int time = 10000;
// 设置最大数量,持续时间,是否循环
particleSystemOptions.setMaxParticles(100);
particleSystemOptions.setDuration(time);
particleSystemOptions.setLoop(true);

// 设置每个粒子 存活时间,以及发射时的状态
particleSystemOptions.setParticleLifeTime(time);
particleSystemOptions.setParticleStartSpeed(new RandomVelocityBetweenTwoConstants(10, 10, 0, 100, 100, 0));

// 设置发射率
particleSystemOptions.setParticleEmissionModule(new com.amap.api.maps.model.particle.ParticleEmissionModule(10, 1000));

// 设置发射位置
particleSystemOptions.setParticleShapeModule(new com.amap.api.maps.model.particle.SinglePointParticleShape(0.1f, 0.1f, 0, true));

// 设置每个粒子生命周期过程中状态变化,包含速度、旋转和颜色的变化
com.amap.api.maps.model.particle.ParticleOverLifeModule particleOverLifeModule = new com.amap.api.maps.model.particle.ParticleOverLifeModule();
particleOverLifeModule.setRotateOverLife(new com.amap.api.maps.model.particle.ConstantRotationOverLife(45));
particleSystemOptions.setParticleOverLifeModule(particleOverLifeModule);

particleSystemOptions.setParticleStartColor(new com.amap.api.maps.model.particle.RandomColorBetWeenTwoConstants(
      225, 137, 134, 255,
      198, 195, 42, 255));

//修正一下比例, 默认都会被绘制成1像素,设置自己的宽高,需要乘上一个比例
particleSystemOptions.setStartParticleSize(64, 64);

ParticleOverlay particleOverlay = aMap.addParticleOverlay(particleSystemOptions);
附录 粒子图层 属性介绍






系统状态
setDuration
整个粒子系统存活时间

setLoop
整个粒子系统是否循环

setMaxParticles
整个粒子系统的粒子最大数量

icon
整个粒子系统的粒子图标,会被转成1x1像素





初始状态
setStartParticleSize
每个粒子的初始大小,单位像素

setParticleLifeTime
每个粒子的存活时间

setParticleStartColor
每个粒子的初始颜色

setParticleStartSpeed
每个粒子的初始速度,单位像素/秒




运行状态-发射模式
setParticleEmissionModule
设置发射率,每个多少时间发射粒子数量,越多会越密集

setParticleShapeModule
设置发射模型,比如所有粒子从一个点出来,或者从某个区域出来


运行状态-生命周期
setParticleOverLifeModule
设置每个粒子生命周期过程中状态变化,包含速度、旋转和颜色的变化




覆盖物接口
zIndex
设置覆盖物层级

isVisibile
设置覆盖物是否展示

destroy
销毁覆盖物









页: [1]
查看完整版本: 粒子图层说明