谁说程序员不懂浪漫?

作为程序员,用自己的代码本事手搓一个技术感十足的惊喜,我觉得,这是不亚于车马慢时代手写信的古典主义浪漫。

那么,应该怎样创作出具有自我身份属性的浪漫惊喜呢?

玩法很多,今天给大家介绍一个不出错的技术控浪漫实操方式——烟花粒子动画,在虚拟空间为对方造一个漫天烟花,平行时空的浪漫,多酷。

必须的,烟花粒子动画效果除了炫浪漫,还有多种切实的应用场景,比如,游戏应用中,玩家得胜后的页面呈现、春节等特定节假日的游戏内氛围打造等。

看个示例

从粒子动画走向更多精彩

烟花粒子动画是搭载HMS Core3D Engine实现的视觉效果,借助3D Engine,还能开启虚拟视界的更多精彩可能。3D Engine为开发者提供高性能、高画质、高扩展性的实时3D引擎,以及便捷高效的可视化开发工具,帮助开发者制作高品质的3D应用。

如果你是游戏开发或者对游戏开发感兴趣,那么你用3D Engine能耍得不只是浪漫。

1、高清渲染与视觉特效,高度还原逼真光影效果;

2、多线程PBR渲染,实现高性能实时3D渲染效果;

3、CPU/GPU粒子渲染,模拟爆炸、火焰、雨雪等视觉特效;

4、3D角色及流畅动画轻松造,支持实时骨骼动画、表情动画、全身IK、动画重定向、多重动画状态机融合;

5、提供自动导航网格生成,多目标的路径规划,NPC智能寻路及智能避障功能;

6、3D Studio提供便捷开发工具,支持场景编辑、材质编辑、动画编辑、地形编辑、脚本编辑等核心功能

总之,3D Engine在手,品质3D游戏场面轻松有,不服来试!

实操指南——用3D Engine实现粒子动画烟花效果

创建关卡

1、您需要创建一个新的关卡:在引擎首页菜单栏中,选择“文件 > 新建关卡”。

2、输入Level名称,比如“Fireworks”后,点击“确认”创建成功。完成后您将进入到玄天引擎的Level界面。

环境搭建

1、在场景烟花效果之前,我们需要适当调整关卡中的环境,首先去除我们用不到的实体:在引擎首页“实体大纲”窗口中的默认环境找到着色球和地面网格实体,鼠标右键点击删除。

2、我们需要模拟一个较暗的环境:选中“实体大纲”窗口默认环境组中的天空,在引擎首页右侧的“组件属性”窗口中找到高动态范围天空盒组件,并调整曝光度属性至-3.2。

3、选中“实体大纲”窗口默认环境组中的太阳,在引擎首页右侧的“组件属性”窗口中找到定向光源组件,并鼠标右击该组件,点击“禁用组件”。

4、在“实体大纲”窗口中鼠标右击选择“创建实体”。

5、在“实体大纲”窗口中选中新创建的实体,在组件属性中重命名为“Bloom”,并添加一个“光晕”组件和“后处理盒”组件来加强烟花粒子的光效。

6、设置光晕组件的参数如下图。

完成以上步骤后你将得到以下效果

材质编辑

1、接下来我们需要为烟花粒子创建一些光效材质,首先在引擎首页的全局菜单栏中点击“工具 > 材质编辑器”打开材质编辑器。

2、在材质编辑器的菜单栏中点击“文件 > 新建”,创建一个新的材质文件。

3、在弹出的窗口中选择材质类型为“ParticleMesh”,并在工程目录中的Assets文件夹中新建一个“Material”文件夹,将材质保持到此文件夹中,重命名为“Particle”。

4、材质编辑器的“材质属性”窗口中展示当前材质类型及可输入参数配置,您可以在此修改其相应的参数设置,参数设置如下图。

·基础颜色:使用基础颜色中的颜色,可以在输入栏中直接输入RGB值,也可以点击颜色方块打开“选择颜色”窗口调整颜色。

·自发光:使用自发光属性,需要先打开“开启”开关。颜色使用方式与基础颜色属性类似,强度决定了自发光的强度。

5、为了丰富我们的粒子光效,我们需要重复2~4步骤,重新创建两个不同颜色的光效材质,并命名为“Particle_02”和“Particle_03”,参数设置如下图。

粒子编辑

1、返回引擎首页,在全局菜单栏中点击“工具 > 粒子编辑器”打开粒子编辑器。

2、在粒子编辑器中的“资源浏览”窗口中找到工程目录中的“Assets”文件夹,点击选中后在浏览模板中鼠标右击并点击“新建文件夹”,命名为“Particle”。

3、在我们步骤2中创建的“Particle”文件夹中鼠标右击并点击“新建粒子系统”,命名为“Fireworks.particle”。

4、双击浏览面板创建的粒子进入编辑,在“发射器”窗口中会显示一个默认效果:精灵粒子使用黄色材质,以每秒10个粒子的速度向上发射,粒子的生命周期为1秒。

5、我们需要创建一个向上发射的粒子部分和一个爆发的粒子部分组成发射和绽放的烟花效果,让我们先编辑一个向上发射的粒子发射器。

点击发射器节点中的“发射器属性”属性分类后,您可在“细节”面板查看该属性分类下的属性模块,按照下图设置粒子最大发射数量和发射器时长。

点击发射器节点中的“生成方式”属性分类,勾选使用“爆发列表”生成方式,并在爆发列表中添加一个元素设置粒子数量为4。

点击发射器节点中的“粒子基础属性”属性分类,设置粒子的生命周期为1.5。

点击发射器节点中的“发射器形状”属性分类,在发射器形状中选择为长方形,并按照下图设置尺寸。

点击发射器节点中的“速度”属性分类,设置Z轴速度为7.0。

点击发射器节点中的“尺寸”属性分类,勾选“尺寸随时间变化”,选择类型为曲线值,并按照下图设置X、Y、Z的最大值和曲线。

点击发射器节点中的“外力”属性分类,勾选加速度,并按下图进行设置。

点击发射器节点中的“光照”属性分类,勾选光照,并按照下图参数进行设置。

点击发射器节点中的“渲染器”属性分类,选择渲染器为“网格体渲染器”,并在“Assets > Material > Particle.material”目录中找到我们在材质编辑章节中保存的材质进行指定。

在网格体中指定“sphere.fbx”。

6、此时,我们已经完成了一个向上发射的粒子发射器,接下来我们需要再对爆发的烟花粒子进行编辑。

首先我们在“发射器”窗口中鼠标右击,点击“添加发射器”添加一个新的发射器。

点击发射器节点中的“发射器属性”属性分类后,按照下图设置发射器属性参数。

点击发射器节点中的“生成方式”属性分类后,按照下图设置生成方式参数。

点击发射器节点中的“粒子基本属性”属性分类后,按照下图设置粒子基本属性参数。

点击发射器节点中的“发射器形状”属性分类后,按照下图设置发射器形状参数。

点击发射器节点中的“速度”属性分类后,按照下图设置速度参数。

点击发射器节点中的“尺寸”属性分类后,按照下图设置尺寸参数。

点击发射器节点中的“外力”属性分类后,按照下图设置外力参数。

点击发射器节点中的“光照”属性分类后,按照下图设置光照参数。

点击发射器节点中的“渲染器”属性分类后,按照下图设置渲染器参数。

7、重复步骤6,创建两个新的发射器,丰富烟花的粒子效果。要注意的是,你可以在新建的两个发射器中设置不同的“速度 > 球形速度”参数和“粒子基本属性 > 粒子生命 > 生命周期”参数来丰富烟花效果,当然你也可以根据你的理解设置其他属性的参数值。

8、此时我们已经完成了一个烟花粒子的设置,为了达到更加丰富的效果,我们可以将该粒子文件进行复制,得到两个新的拥有相同属性参数的粒子效果,我们将其命名为“Fireworks_02”和“Fireworks_03”。

9、在粒子编辑器中打开“Fireworks_02”粒子文件,分别点击四个发射器节点中的“渲染器”属性分类,将材质指定为我们在“材质编辑”章节中保存的其他颜色的材质文件“Particle_02”来丰富我们的烟花效果并保存我们的编辑。同理我们在“Fireworks_03”粒子文件中可以指定新的材质文件“Particle_03”。

放置粒子

1、返回引擎首页,在“实体大纲”窗口中鼠标右击点击“创建实体”,创建7个空白实体,并在“组件属性”窗口中为其重命名,可参考下图。

2、在“实体大纲”窗口中多选新建的7个实体后,在“组件属性”窗口在为其添加“粒子组件”。

3、在“粒子”组件中,指定我们保存的粒子文件,并打开“开启”按钮,这里我们可以为每个实体随机指定“Fireworks”、“Fireworks_02”和“Fireworks_03”粒子文件。

5、使用视口的控件随机摆放7个实体的位置和旋转,这将决定烟花发射的角度和位置。

6、最后我们还需要调整一下相机的角度和位置,我们在“实体大纲”窗口默认环境中选中“相机”实体。

7、在“组件属性”窗口中找到“飞行摄像机输入”组件,鼠标右击该组件,并将其删除。

8、在相机组件中,点击进入摄像机视角后,你的视口将会呈现相机视角,你可以在视口中使用鼠标和键盘移动视角。

9、选定好最佳的观赏位置后,点击“返回默认编辑器相机视角”。

最终效果

完成上述步骤后,点击运行按钮的下拉菜单,选择“Play (Maximized)”全屏运行,您就可运行此场景了。

了解更多详情>>

访问3D Engine开发者联盟官网

访问华为开发者联盟官网

获取开发指导文档

华为移动服务开源仓库地址:GitHubGitee

关注我们,第一时间了解 HMS Core 最新技术资讯~

程序员的专属浪漫——用3D Engine 5分钟实现烟花绽放效果的更多相关文章

  1. 用微信表情翻译表白,程序员的小浪漫,赶紧Get起来!

  2. 打磨程序员的专属利器——命令行&界面

    工欲善其事,必先利其器,程序员更是如此,如果没有一套与自己思维同步的工具,将非常难受并且编码效率会非常低. 但十个程序员就有对工具的十种不同理解,本人现在冒然将自己的“工具箱”拿出来晒晒.若对大家没帮 ...

  3. 程序员的专属微信公众号编辑器:定制 Markdown 转 HTML

    效果(Gif) 点击我查看 仓库地址 https://github.com/cdk8s/cdk8s-markdown-to-html https://gitee.com/cdk8s/cdk8s-mar ...

  4. 520特辑丨码神VS爱神:盘点程序员的四大男友力,你偏爱哪一种?

    摘要:写卡路里计数器带女友减肥,抢票不忘分析系统bug,打造独家游戏只为成为你的另一半,程序员男友"浪漫"起来,谁能招架得住? 本文分享自华为云社区<520特辑丨码神VS爱神 ...

  5. 程序员的情人节「GitHub 热点速览 v.22.07」

    又是一年情人日,刚好还是发文的今天.也没什么好送的,送点程序员的浪漫--代码和开源项目吧.记得在本周特推查收这份来自程序员的独有浪漫. 本周 GitHub 霸榜的项目基本上都是老项目,从老项目中挖点新 ...

  6. 腾讯微信支付,程序员是如何让jQuery代码付钱的

    微信支付和支付宝支付已经是我们生活中不可确实的两个金融软件了,也是必备的,小编认为小钱用微信,大钱用支付宝. 下面这个图是我们生活中用腾讯微信支付平台的最后一个页面,大家想不想知道这个页面是如果做出来 ...

  7. 程序员PS技能(四):程序员创建PSD文件、展示简单PSD设计流程,上传PSD至蓝湖,并下载Demo切图

    前言   本篇是程序员仿照ui设计创建psd且切图五个按钮效果上传至蓝湖,本篇篇幅较长,整体完成一个目标,没有分篇幅了.   前提条件   已经安装了PS,已经在PS上安装了蓝湖插件,并且曾经已经上传 ...

  8. 漫谈程序员系列:3D打印能打印出程序员吗

    首先声明,本文是一本正经的胡扯,绝不是随随便便的胡扯,请您不要随便攻击我胡说八道.我要反复星爷在<喜剧之王>里的台词:事实上.我是一本正经的喷子. 3D打印的定义 关于3D打印,以下是来自 ...

  9. 程序员用HTML5给女朋友制作的3D相册

    程序员给女朋友用HTML5制作的3D相册,使用鼠标拖拽,能看到3D旋转效果,点击相片,相片能放大,移近.程序员发挥自己的专长,这是那些不懂编程的人望尘莫及的.本相册使用了HTML5的画布技术,需要谷歌 ...

  10. C#程序员整理的Unity 3D笔记(十):Unity3D的位移、旋转的3D数学模型

    遇到一个想做的功能,但是实现不了,核心原因是因为对U3D的3D数学概念没有灵活吃透.故再次系统学习之—第三次学习3D数学. 本次,希望实现的功能很简单: 如在小地图中,希望可以动态画出Player当前 ...

随机推荐

  1. ajax优点与缺点

    ajax的优点 Ajax的给我们带来的好处大家基本上都深有体会,在这里我只简单的讲几点: 1.最大的一点是页面无刷新,在页面内与服务器通信,给用户的体验非常好. 2.使用异步方式与服务器通信,不需要打 ...

  2. 微信小程序DEMO初体验

    小程序虽然被炒的很热,但是绝大部分人却从未亲自体验过,在2017年的上班第一天,献上一个小程序DEMO,您可以体验! 注意:由于微信限制,只能使用扫一扫来体验下方小程序DEMO. DEMO首页截图如下 ...

  3. [USACO2003][poj2018]Best Cow Fences(数形结合+单调队列维护)

    http://poj.org/problem?id=2018 此乃神题……详见04年集训队论文周源的,看了这个对斜率优化dp的理解也会好些. 分析: 我们要求的是{S[j]-s[i-1]}/{j-(i ...

  4. mode(思维,注意内存)

    mode Time Limit:1000MS     Memory Limit:1024KB     64bit IO Format:%lld & %llu Submit Status Pra ...

  5. 复杂和遗留的数据库schema

    本文作者:苏生米沿 本文地址:http://blog.csdn.net/sushengmiyan/article/details/50414652 In this chapter, we focus ...

  6. [转帖]流程控制:for 循环

    流程控制:for 循环 http://wiki.jikexueyuan.com/project/linux-command/chap34.html need more study need more ...

  7. sql 条件汇总

    select * from a pivot(sum([总业绩]) for 周期 in ([1月],[2月],[3月],[4月])) as b

  8. maven将依赖依赖打包到jar中

    通过maven-assembly-plugin插件可以实现将依赖jar包打包到自己的jar包中的需求,只需要在pom.xml中配置该插件即可,配置如下: <build> <plugi ...

  9. Caching漫谈--关于Cache的几个理论

    如今缓存是随处可见了,如果你的程序还没有使用到缓存,那可能是你的程序并发量很低,或对实时性要求很低.我们公司的ERP在显示某些报表时,每次打开都需要花上几分钟的时间,假如搜索引擎也是这么慢,我想这家搜 ...

  10. CSS 居中大全(转)

    引用:http://jinlong.github.io/blog/2013/08/13/centering-all-the-directions/ CSS 居中大全 AUG 13TH, 2013 |  ...