【UE Niagara】在UI上生成粒子

2024-05-11 14:36
文章标签 ui 生成 ue 粒子 niagara

本文主要是介绍【UE Niagara】在UI上生成粒子,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

效果

步骤

1. 在虚幻商城中将“Niagara UI Render”插件安装到引擎

2. 打开虚幻编辑器,勾选插件“Niagara UI Renderer”,然后重启编辑器

3. 先创建一个控件蓝图,该控件蓝图只包含一个按钮

这里设置尺寸框尺寸为200*50

4. 显示该控件 

5. 新建一个Niagara系统

选择来自所选发射器的新系统

选择模板“Simple Sprite Burst”

这里命名为“NS_ButtonPressed”

打开“NS_ButtonPressed”。因为按钮是一个矩形,因此我们想让粒子在一个盒体范围内随机生成,这里可以添加一个“Shape Location”模块,设置“Shape Primitive”为“Box/Plane”

由于按钮大小为200*50,因此这里设置“Box Size”如下

设置粒子单次可生成1000个

在“Initialize Partic”模块中设置粒子的初始大小在4~6cm

此时效果如下:

6. 回到控件蓝图,将“Niagara System Widget”拖入画布面板

让其铺满整个画布(“Niagara System Widget”控件的大小其实无所谓,主要是它的中心点,我们要基于这个中心点的位置来产生粒子效果)

设置Niagara System为我们上面创建的“NS_ButtonPressed”,此时可以看到有一个报错警告,这是因为粒子使用的材质的材质域不正确

7. 回到“NS_ButtonPressed”中,可以看到粒子使用的材质是系统自带的材质

打开该材质可以看到该材质使用的材质域是表面

因此,这里我们可以自己创建一种粒子所使用的材质。

8. 这里命名材质为“M_P_Basic”,设置材质域为表面,混合模式为半透明,着色模型为无光照

在材质图表中添加如下节点

9. 在“NS_ButtonPressed”中,设置Sprite渲染器中的粒子材质为“M_P_Basic”

10. 回到控件蓝图中,点击“Populate Remap List”

这是会自动帮我们进行如下设置

11. 在内容浏览器中点击鼠标右键,然后选择“Create Niagara UI Material”

此时会自动创建一个新材质

12. 在控件蓝图中,设置新生成的材质

此时编译后可以看到粒子已经可以显示在控件上:

13. 接下来我们需要修改一下粒子的样式。打开“NS_ButtonPressed”,我们希望粒子能够由一点向外散开,因此可以添加一个“Add Velocity”模块,设置“Velocity Mode”为“From Point”,“Velocity Speed”为100

此时粒子效果如下

 

再添加一个卷曲噪声力

此时效果如下:

添加一个“Drag”模块

在“Initialize Particle”中设置生命周期时长范围和粒子初始颜色(注意这里的RGB三个值最好不要超过1,否则在控件上可能无法正确显示粒子的颜色)

此时粒子效果如下:

如果我们不希望粒子是一个球形,我们可以使用“Scale Sprite Size by Speed”模块对粒子进行拉伸

再设置速度对齐

此时效果如下

在控件蓝图中,我们点击编译后就可以正常显示粒子效果了

14. 如果我们希望在控件上粒子也有自发光效果,我们可以先复制一份材质,这里命名为“M_P_Glow_UI”

打开“M_P_Glow_UI”,添加如下节点

15. 在控件蓝图中替换映射后的材质为“M_P_Glow_UI”

接下来我们希望当编译时不激活粒子效果,只有按钮按下再激活粒子效果。可以先取消勾选“Auto Activate”

为了防止点不到按钮,我们需要设置NiagaraSystemWidget的可视性为非可命中测试

在按钮的点击事件中添加如下节点

最终效果如文章开头所示。

参考视频:

https://www.youtube.com/watch?v=1shJqOcEb0E

这篇关于【UE Niagara】在UI上生成粒子的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/979814

相关文章

Java使用Javassist动态生成HelloWorld类

《Java使用Javassist动态生成HelloWorld类》Javassist是一个非常强大的字节码操作和定义库,它允许开发者在运行时创建新的类或者修改现有的类,本文将简单介绍如何使用Javass... 目录1. Javassist简介2. 环境准备3. 动态生成HelloWorld类3.1 创建CtC

Python从Word文档中提取图片并生成PPT的操作代码

《Python从Word文档中提取图片并生成PPT的操作代码》在日常办公场景中,我们经常需要从Word文档中提取图片,并将这些图片整理到PowerPoint幻灯片中,手动完成这一任务既耗时又容易出错,... 目录引言背景与需求解决方案概述代码解析代码核心逻辑说明总结引言在日常办公场景中,我们经常需要从 W

C#使用Spire.XLS快速生成多表格Excel文件

《C#使用Spire.XLS快速生成多表格Excel文件》在日常开发中,我们经常需要将业务数据导出为结构清晰的Excel文件,本文将手把手教你使用Spire.XLS这个强大的.NET组件,只需几行C#... 目录一、Spire.XLS核心优势清单1.1 性能碾压:从3秒到0.5秒的质变1.2 批量操作的优雅

Python使用python-pptx自动化操作和生成PPT

《Python使用python-pptx自动化操作和生成PPT》这篇文章主要为大家详细介绍了如何使用python-pptx库实现PPT自动化,并提供实用的代码示例和应用场景,感兴趣的小伙伴可以跟随小编... 目录使用python-pptx操作PPT文档安装python-pptx基础概念创建新的PPT文档查看

在ASP.NET项目中如何使用C#生成二维码

《在ASP.NET项目中如何使用C#生成二维码》二维码(QRCode)已广泛应用于网址分享,支付链接等场景,本文将以ASP.NET为示例,演示如何实现输入文本/URL,生成二维码,在线显示与下载的完整... 目录创建前端页面(Index.cshtml)后端二维码生成逻辑(Index.cshtml.cs)总结

Python实现数据可视化图表生成(适合新手入门)

《Python实现数据可视化图表生成(适合新手入门)》在数据科学和数据分析的新时代,高效、直观的数据可视化工具显得尤为重要,下面:本文主要介绍Python实现数据可视化图表生成的相关资料,文中通过... 目录前言为什么需要数据可视化准备工作基本图表绘制折线图柱状图散点图使用Seaborn创建高级图表箱线图热

SQLServer中生成雪花ID(Snowflake ID)的实现方法

《SQLServer中生成雪花ID(SnowflakeID)的实现方法》:本文主要介绍在SQLServer中生成雪花ID(SnowflakeID)的实现方法,文中通过示例代码介绍的非常详细,... 目录前言认识雪花ID雪花ID的核心特点雪花ID的结构(64位)雪花ID的优势雪花ID的局限性雪花ID的应用场景

Django HTTPResponse响应体中返回openpyxl生成的文件过程

《DjangoHTTPResponse响应体中返回openpyxl生成的文件过程》Django返回文件流时需通过Content-Disposition头指定编码后的文件名,使用openpyxl的sa... 目录Django返回文件流时使用指定文件名Django HTTPResponse响应体中返回openp

WinForm跨线程访问UI及UI卡死的解决方案

《WinForm跨线程访问UI及UI卡死的解决方案》在WinForm开发过程中,跨线程访问UI控件和界面卡死是常见的技术难题,由于Windows窗体应用程序的UI控件默认只能在主线程(UI线程)上操作... 目录前言正文案例1:直接线程操作(无UI访问)案例2:BeginInvoke访问UI(错误用法)案例

python生成随机唯一id的几种实现方法

《python生成随机唯一id的几种实现方法》在Python中生成随机唯一ID有多种方法,根据不同的需求场景可以选择最适合的方案,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习... 目录方法 1:使用 UUID 模块(推荐)方法 2:使用 Secrets 模块(安全敏感场景)方法