Unity爆炸真实感关键在生命周期控制、速度发散逻辑、颜色衰减节奏;需用Cone/Hemisphere形状或脚本设初速度向量,ColorOverLifetime按0%白→30%橙红→70%暗红→100%透明配缓入缓出曲线,Canvas优化用贴图批渲染并禁用抗锯齿,Three.js穿模需Raycaster检测或对高能粒子启用物理引擎,核心是分阶段精准控制能量节奏。

ParticleSystem 是 Unity 里做爆炸最直接的工具,但光拖个预制件进去往往只是“像爆炸”,不是“真爆炸”——关键在粒子的生命周期控制、速度发散逻辑、颜色衰减节奏这三点。
怎么让粒子炸得有方向感,不糊成一团?
默认 ParticleSystem 的球形发射器会让粒子朝所有方向飞,但真实爆炸有主冲击方向(比如向上翻卷的火球)+ 次级碎片(向四周溅射)。解决方法是:不用 createSphereEmitter,改用 ShapeModule 配合锥形(Cone)或半球(Hemisphere)形状,并手动设置 angle 和 radius。
更可控的做法是关掉 Shape 模块,用脚本在爆炸瞬间批量生成粒子并指定初速度向量:
var dir = Random.onUnitSphere;这样比纯随机更符合物理直觉。
dir.y = Mathf.Max(dir.y, 0.3f); // 抬高 Y 分量,模拟火球上冲
particle.velocity = dir * Random.Range(8f, 15f);
为什么爆炸粒子一出来就变暗,像没烧起来?
问题出在 ColorOverLifetimeModule 的渐变曲线没对齐能量峰值。典型错误是把红色设在起点、白色设在中点、黑色设在终点——结果粒子刚飞出去就褪色了。
正确节奏应该是:
• 0% → 纯白(高温等离子态)
• 30% → 橙红(燃烧最旺)
• 70% → 暗红(余烬)
• 100% → 透明(消失)
别用线性渐变,用缓入缓出(Ease In Out)让亮度变化更自然。Unity 编辑器里右键渐变条可添加关键帧,拖动贝塞尔手柄调曲线斜率。
Canvas 2D 爆炸为啥卡顿,尤其粒子一多就掉帧?
Canvas 渲染粒子本质是每帧调用 ctx.beginPath() + ctx.arc() + ctx.fill(),50 个粒子就 150 次 API 调用,浏览器扛不住。
优化核心是:**放弃逐粒子绘制,改用单次 ctx.drawImage() 渲染贴图粒子批**。
• 提前画好 3–5 张不同大小/透明度的圆形贴图到离屏 canvas
• 粒子数据只存 x, y, size, alpha 四个字段
• 每帧用 for 循环批量调用 ctx.drawImage(),传入对应贴图和缩放参数
• 关键:必须加 ctx.imageSmoothingEnabled = false,否则缩放模糊且性能更差
Three.js 里爆炸粒子飞着飞着就穿模/穿墙?
这是没启用碰撞检测的典型表现。Three.js 的 ParticleSystem 默认无物理,粒子就是数学点,不会“撞”到场景物体上。
若需真实交互(比如爆炸冲击波推开箱子),有两个轻量方案:
• 用 THREE.Raycaster 在每帧检测粒子是否击中网格,命中后触发事件(适合少量关键粒子)
• 更通用的是接入 cannon-es 或 rapier 物理引擎,把粒子设为 BodyType.KINEMATIC,靠速度推动刚体——但注意:5000+ 粒子全走物理会崩,建议只对前 200 个高能量粒子启用
真正容易被忽略的是:粒子位置更新必须在 renderer.render() 前完成,否则会出现“一帧延迟”的穿模现象
爆炸效果的真实感不来自粒子数量,而来自时间维度上的能量节奏控制——从爆发、膨胀、冷却到消散,每个阶段的速度衰减率、颜色偏移量、尺寸收缩比都得单独调。调参时盯着秒表数帧:0.1 秒内该亮到什么程度,0.3 秒该扩散多大范围,这些才是决定“像不像”的硬指标。










