要求

这次作业主要是学习粒子系统的使用,在 http://i-remember.fr/en 网站上,可以看到一个很酷炫的白色粒子光带,效果如下:

当鼠标hover到图一中间的+号圆圈中间时,光环会收缩成图二的状态,具体效果可自行前往网站体验~

我们需要模仿这个效果并尝试用粒子流编程控制来实现。

实现

光环在收缩前较为分散,位于光环中间的部分粒子较周围密集,因此我想用一个正太分布来模拟粒子在光环半径范围内的分布状况。这里我采用了Box-Muller 算法来到服从正态分布的随机数,基本思想是先得到服从均匀分布的随机数再将服从均匀分布的随机数转变为服从正态分布。关于Box-Muller 算法可参考百度百科

class Ndistribution{System.Random rand = new System.Random();public double getNormalDistribution(double mean, double stdDev){double u1 = 1.0 - rand.NextDouble(); //uniform(0,1] random doublesdouble u2 = 1.0 - rand.NextDouble();double randStdNormal = Math.Sqrt(-2.0 * Math.Log(u1)) *Math.Sin(2.0 * Math.PI * u2); //random normal(0,1)double randNormal = mean + stdDev * randStdNormal; //random normal(mean,stdDev^2)return randNormal;}
}

有了生成服从正太分布随机数的函数之后,接下来我们将用一个脚本来控制粒子的生成以及粒子坐标的变化。
首先声明一下属性:

    public int particleNum = 10000; // 粒子数目public float minRadius = 5.0f;  // 光环最小半径public float maxRadius = 10.0f; // 光环最大半径private ParticleSystem.Particle[] particles;private float[] particleAngle;  // 粒子角度private float[] particleR;  // 粒子半径private int speedLevel = 5; // 粒子旋转速度水平private float particleSpeed = 0.1f;  // 粒子旋转速度private Ray ray;private RaycastHit hit;// 收缩前粒子位置private float[] before;   // 收缩后粒子位置private float[] after;   // 粒子缩放的速度private float shrinkSpeed = 2f;private bool ischange = false;

在Start()函数中执行初始化的工作,这里的重点是为每一个粒子利用上面提到的随机数生成函数生成一个半径,同时也为它们随机生成(0, 360)之间的一个角度,这样粒子就可以根据半径与角度,形成一个圆形光环。并且还需要令刚生成的半径作为光环收缩前粒子的半径,收缩后的半径我设定为原来的0.7倍。这样一来,效果应该是从一个大的服从正太分布的光环变成一个小的光环,而理想中的效果在收缩后在最内圈的粒子比较集中。因此,我为收缩后半径小于一定数值的粒子重新生成一个收缩半径,如下面的代码所示:

    void Start () {particleAngle = new float[particleNum];particleR = new float[particleNum];before = new float[particleNum];after = new float[particleNum];particles = new ParticleSystem.Particle[particleNum];particleSystem.maxParticles = particleNum;particleSystem.Emit(particleNum);particleSystem.GetParticles(particles);Ndistribution nd = new Ndistribution();// 每个粒子在初始化的时候都设定好收缩前和收缩后的粒子半径for (int i = 0; i < particleNum; i++){float r = (float)nd.getNormalDistribution((minRadius+maxRadius)*0.5f, 1);float angle = UnityEngine.Random.Range(0.0f, 360.0f);particleAngle[i] = angle;particleR[i] = r;before[i] = r;after[i] = 0.7f * r;if (after[i] < minRadius * 1.1f){float midRadius = minRadius * 1.05f;after[i] = UnityEngine.Random.Range(UnityEngine.Random.Range(minRadius, midRadius), (minRadius * 1.1f));}}}

然后在每一帧执行Update()函数时更新所有粒子的位置,实现旋转。根据遍历粒子数组时的index的奇偶性,来区分粒子的旋转方向;同时利用不同速度级别和基本旋转速度的乘积,来实现粒子以不同速度旋转。

     // 通过奇偶控制粒子顺时针或逆时针旋转 if (i % 2 == 0)  {  // 逆时针particleAngle[i] += (i % speedLevel + 1) * particleSpeed;  }  else  {  // 顺时针particleAngle[i] -= (i % speedLevel + 1) * particleSpeed;  }  particleAngle[i] = particleAngle[i] % 360;// 转换为弧度制float rad = particleAngle[i] / 180 * Mathf.PI;  // 更新粒子坐标particles[i].position = new Vector3(particleR[i] * Mathf.Cos(rad), particleR[i] * Mathf.Sin(rad), 0f);  

接着还要实现鼠标悬停中间后粒子收缩的效果。unity3d不像web一样直接可以用hover,我参考了网上的博客,使用光线射击到中间物体的方法。注意这里需要为光环gameObject添加Box Collider,并设置合适的大小。

缩放的实现是根据初始化时生成的半径,逐帧更改粒子当前的半径直到与设定的大小一致。

ray = camera.ScreenPointToRay(Input.mousePosition);
if (Physics.Raycast(ray, out hit) && hit.collider.gameObject.tag == "button") ischange = true;
else ischange = false;
...if (ischange)
{// 开始收缩if(particleR[i] > after[i]){particleR[i] -= shrinkSpeed * (particleR[i] / after[i]) * Time.deltaTime;}
}
else
{// 开始还原if (particleR[i] < before[i]){particleR[i] += shrinkSpeed * (before[i] / particleR[i]) * Time.deltaTime;}else if (particleR[i] > before[i]){particleR[i] = before[i];}
}

最后附上相关参数设定:


最终效果

演示视频地址:https://www.bilibili.com/video/av24101271/
完整项目源码见GitHub:https://github.com/CarolSum/Unity3d-Learning/tree/master/hw7

Unity3d-粒子光环特效相关推荐

  1. Unity3D学习:制作粒子光环特效

    最近看到一个网站,感觉里面的特效不错http://i-remember.fr/en 所以我尝试制作一下里面的粒子光环,鼠标悬停中间的按钮就会粒子收缩,移开就会扩散,先上效果图如下: 下面讲讲思路:首先 ...

  2. Unity3d-制作粒子光环特效

    利用Unity3d制作一个特效,与这个网站效果类似: 首先,在Unuty3d下面建立了一个object,命名为Particle. 然后建立一个脚本:并挂在刚刚建立的gameobject下面 然后然后依 ...

  3. Unity3d 粒子光环制作

    这一次,要参照I Remember网站开始界面的那个光环,用粒子系统做一个类似的光环,当然,我做的没网站上的那么好看,就,增加一点儿自己的东西吧. 首先,来看一下成品图: 图中有两个环,它们转的方向相 ...

  4. Unity3D——粒子光环

    参考网站首页的光环效果:http://i-remember.fr/en 这次作业总的来说属于简单的场景设置,前段时间学习各种模式编程小游戏的时候,整的学起来有点吃力有点难,这次作业的体验很赞,可能因为 ...

  5. Unity3d Note8(粒子光环)

    1.作业要求 2.实现过程 2.1游戏对象建立 2.2圆环制备 2.3旋转 2.4改进 3.源代码 1.作业要求 参考 http://i-remember.fr/en 这类网站,使用粒子流编程控制制作 ...

  6. 【Unity3d学习】粒子光环的制作——粒子编程初体验

    写在前面 Unity3d学习制作的实验资料包括本次实验都在老师的课程网站上:传送门 视频地址:传送门 实验项目文件在Github上面:Github传送门 实验参考博客:感谢指导! Unity3D学习笔 ...

  7. ## Unity3D实现粒子光环效果

    Unity3D实现粒子光环效果 参考效果: http://i-remember.fr/en 基本思路如下 1. 使用unity3d自带的粒子系统 2. 为圆环设置最大半径maxR和最小半径minR 3 ...

  8. 粒子编程初试——粒子光环制作

    写在前面 实验参考博客:感谢指导! Unity3D学习笔记(9)-- 粒子光环 Unity3d--ParticleSystem粒子光环 堂上编程练习(有错误,仅作参考):Unity制作神奇的粒子海洋! ...

  9. 【博物纳新】Isaura—光环特效开源库评测

    [博物纳新]是UWA重磅推出的全新栏目,旨在为开发者推荐新颖.易用.有趣的开源项目,帮助大家在项目研发之余发现世界上的热门项目.前沿技术或者令人惊叹的视觉效果,并探索将其应用到自己项目的可行性.很多时 ...

  10. vuejs粒子动画特效 npm安装插件vue-particles(particles.js) - 代码篇

    文章目录 1. npm 安装插件`vue-particles` 2. 效果图: 3. 代码截图: 4. 代码示下: 5. 附件 · 文章阅读: 1. npm 安装插件vue-particles npm ...

最新文章

  1. python自学入门教程-Python自学入门基础教程-数据类型
  2. Kafka官方文档翻译——简介
  3. sqlserver安装时尽量少的占用c盘_安装3dmax出现command line option 报错,如何解决
  4. c语言实训模块化程序设计,C语言 实验三 模块化程序设计.doc
  5. Java的二十三种设计模式(原型模式(Prototype))
  6. shell判断字符串是否为数字
  7. burpsuite上传截断拿shell
  8. html为标题添加脚注,如何在rmarkdown html中的特定标题下放置脚注?
  9. 上海公积金提取办法(外地购房,公积金在上海)
  10. 从0开始强化学习——强化学习的简介和分类
  11. 用python写一段计算autocad多段线长度的代码
  12. AT指令(中文详解版)(一)
  13. 音视频开发系列(7):完成本地摄像头直播推流
  14. 人工智能入门第一课:手写字体识别及可视化项目(手写画板)(mnist)
  15. RemoteViews的用法
  16. 【IDEA快捷键】记一些idea快捷键
  17. elementUI el-date-picker表单组件
  18. 华为手机助手安卓版_渲美手机恢复助手安卓版安卓版下载-渲美手机恢复助手安卓版app下载...
  19. 【MATLAB】判断语句和循环语句
  20. 【蓝桥杯Java】大写(c ^ (1 << 5))

热门文章

  1. Web车牌识别中API接口的调用
  2. C++构造函数的幕后工作
  3. CSS Tutorial for Beginners
  4. 电力线巡检--输电线路杆塔异物检测数据集(4500+图片,xml标注)
  5. Proxyee-down的下载与安装教程
  6. 操作系统中调度算法(FCFS、RR、SPN、SRT、HRRN)
  7. 什么是数据传输服务DTS
  8. PHP聚合数据-全国车辆违章
  9. matlab分数递减指令,5.2.3 PLC的递增、递减指令
  10. 【读点论文】YOLOv4: Optimal Speed and Accuracy of Object Detection,讲明目标检测结构,分析先进的涨点tricks,实现一种精度与速度的平衡