ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

Cocos Engine 粒子系统完整教程:5 分钟调出火焰、烟雾与雨雪

Cocos Engine 粒子系统完整教程:5 分钟调出火焰、烟雾与雨雪 Cocos Engine 粒子系统完整教程5 分钟调出火焰、烟雾与雨雪【免费下载链接】cocos-engineCocos simplifies game creation and distribution with Cocos Creator, a free, open-source, cross-platform game engine. Empowering millions of developers to create high-performance, engaging 2D/3D games and instant web entertainment.项目地址: https://gitcode.com/GitHub_Trending/co/cocos-engine掌握 Cocos Engine 粒子系统你 5 分钟就能做出火焰、烟雾、雨雪和技能火花。这篇粒子特效教程基于 Cocos Creator 编辑器讲解零渲染基础可读文末两份配方可直接照抄。粒子能帮你解决哪些画面问题 三类画面Cocos Engine 粒子系统单独就能完成不需要后处理技能火花剑击命中沿打击方向喷出一小撮亮粒生命周期压到 0.3~0.5 秒快速消散才有命中感。天气雨雪发射器铺满整个画面开prewarm开局就满屏之后雨持续落下。爆炸冲击一个 Burst 事件一次性喷出几十上百个粒子再靠外力和尺寸曲线快速衰减实现代码见 burst.ts。做 2D 游戏UI 火花、背景雨雪用ParticleSystem2D实现位于 particle-system-2d.ts3D 场景用ParticleSystem。5 分钟调出第一个特效 ⏱️四步走每步只改最少参数加发射器选中空节点添加ParticleSystem组件 →capacity100、duration5s、loop打开 → 你会看到一簇白色粒子从节点位置喷出。变密集rateOverTime改200、startLifetime改1.2s、capacity改300→ 粒子流从稀疏变连续不再是一个个点。换外观startSize改0.1、startColor改纯白 → 粒子变小亮点接近火花质感。动起来startSpeed改5发射形状选Cone、角度20°→ 粒子沿锥形方向从一个点喷出去。组件完整定义见 particle-system.ts可选发射形状Box、Circle、Cone、Sphere 等在 shape-module.ts。把效果调出层次感的 4 个维度 Cocos Engine 粒子系统里上百个粒子效果参数按维度归类后只有 4 组按顺序调。1. 颜色与透明startColor定起点颜色colorOverLifetime定随时间的曲线。透明度控制淡出起点 alpha 1、终点 alpha 0粒子就渐变消失而不是突然消失。典型值t0 橙色t1 同色但 alpha0。2. 大小与旋转startSize定初始尺寸sizeOverLifetime收尾到 0典型 0.3→0画面就是基部宽、尖端收。startRotation定初始角度rotationOverLifetime给 ±90°/s烟雾会边飘边转。3. 运动与外力startSpeed管初速度forceOverLifetime管持续外力。方向决定画面正值向下是雨gravityModifier-0.5向上就是烟。实现见 force-overtime.ts。4. 随机扰动打开noiseModule强度0.5、频率1→ 轨迹开始弯曲摆脱直线的机械感。源码在 noise-module.ts。性能与常见翻车点 ⚙️本节是粒子性能优化清单每条都带数字。Cocos Engine 粒子系统的开销集中在活粒子和 overdraw 两处。移动端粒子上限单屏活粒子总数 ≤1000单系统capacity≤500rateOverTime≤300。capacity≥rateOverTime×startLifetime200×1.2240至少设 300。不满足时新粒子被静默丢弃这是调了发射数但画面没变密的头号原因。何时选 GPU 渲染粒子多≥1000且运动简单用 GPU 路径见 particle-system-renderer-gpu.ts需要碰撞、拖尾、逐粒子逻辑才选 CPU。剔除开关与 overdraw打开renderCullingtrue启用视锥剔除系统离开相机视口直接停渲染逻辑见 particle-culler.ts。overdraw 是隐形杀手500 个以上大半透明粒子叠放移动端帧率明显下滑降startSize或密度。const ps node.getComponent(ParticleSystem); ps.capacity 500; // 单系统上限 ps.renderCulling true; // 出视口即停渲染两份可直接照抄的特效配方 下面两份 Cocos Engine 粒子系统配方在编辑器里直接改参数即可无需写代码。火焰特效参数表参数取值/区间画面效果发射形状Cone角度 15°~25°粒子从一点聚拢喷出rateOverTime150~300火苗连续不断startLifetime0.8~1.5s越大火苗拉得越高startSpeed2~4低速让火焰爬升而非喷射startSize0.3~0.5sizeOverLifetime收到 0基部宽、尖端收起始颜色黄白→橙alpha 收到 0尖端渐隐无生硬边缘noiseModule强度0.3~0.5火苗尖端摇曳跳动魔法拖尾参数表参数取值/区间画面效果rateOverTime100~200光点拖尾连续startLifetime0.5~0.8s拖尾快速消散不残留startSize0.1~0.15细光点不抢主体起始颜色亮青→alpha 0拖尾逐渐消失trailModuleduration0.3~0.5光点拉出短飘带limitVelocityOverLifetime衰减到 0.1光点减速落定拖尾依赖 trail.ts打开trailModule后把 duration 压到 0.5s 以内拖尾长度才可控。源码粒子全部实现位于 cocos/particle/官方文档docs/示例代码tests/particle/这份 Cocos Engine 粒子系统教程到此为止照着参数调就能出效果。【免费下载链接】cocos-engineCocos simplifies game creation and distribution with Cocos Creator, a free, open-source, cross-platform game engine. Empowering millions of developers to create high-performance, engaging 2D/3D games and instant web entertainment.项目地址: https://gitcode.com/GitHub_Trending/co/cocos-engine创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表