【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

相关文章

Python实现自动化Word文档样式复制与内容生成

《Python实现自动化Word文档样式复制与内容生成》在办公自动化领域,高效处理Word文档的样式和内容复制是一个常见需求,本文将展示如何利用Python的python-docx库实现... 目录一、为什么需要自动化 Word 文档处理二、核心功能实现:样式与表格的深度复制1. 表格复制(含样式与内容)2

python如何生成指定文件大小

《python如何生成指定文件大小》:本文主要介绍python如何生成指定文件大小的实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录python生成指定文件大小方法一(速度最快)方法二(中等速度)方法三(生成可读文本文件–较慢)方法四(使用内存映射高效生成

VS配置好Qt环境之后但无法打开ui界面的问题解决

《VS配置好Qt环境之后但无法打开ui界面的问题解决》本文主要介绍了VS配置好Qt环境之后但无法打开ui界面的问题解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要... 目UKeLvb录找到Qt安装目录中designer.UKeLvBexe的路径找到vs中的解决方案资源

Maven项目中集成数据库文档生成工具的操作步骤

《Maven项目中集成数据库文档生成工具的操作步骤》在Maven项目中,可以通过集成数据库文档生成工具来自动生成数据库文档,本文为大家整理了使用screw-maven-plugin(推荐)的完... 目录1. 添加插件配置到 pom.XML2. 配置数据库信息3. 执行生成命令4. 高级配置选项5. 注意事

MybatisX快速生成增删改查的方法示例

《MybatisX快速生成增删改查的方法示例》MybatisX是基于IDEA的MyBatis/MyBatis-Plus开发插件,本文主要介绍了MybatisX快速生成增删改查的方法示例,文中通过示例代... 目录1 安装2 基本功能2.1 XML跳转2.2 代码生成2.2.1 生成.xml中的sql语句头2

QT6中绘制UI的两种方法详解与示例代码

《QT6中绘制UI的两种方法详解与示例代码》Qt6提供了两种主要的UI绘制技术:​​QML(QtMeta-ObjectLanguage)​​和​​C++Widgets​​,这两种技术各有优势,适用于不... 目录一、QML 技术详解1.1 QML 简介1.2 QML 的核心概念1.3 QML 示例:简单按钮

使用Python自动化生成PPT并结合LLM生成内容的代码解析

《使用Python自动化生成PPT并结合LLM生成内容的代码解析》PowerPoint是常用的文档工具,但手动设计和排版耗时耗力,本文将展示如何通过Python自动化提取PPT样式并生成新PPT,同时... 目录核心代码解析1. 提取 PPT 样式到 jsON关键步骤:代码片段:2. 应用 JSON 样式到

SpringBoot实现二维码生成的详细步骤与完整代码

《SpringBoot实现二维码生成的详细步骤与完整代码》如今,二维码的应用场景非常广泛,从支付到信息分享,二维码都扮演着重要角色,SpringBoot是一个非常流行的Java基于Spring框架的微... 目录一、环境搭建二、创建 Spring Boot 项目三、引入二维码生成依赖四、编写二维码生成代码五

在 PyQt 加载 UI 三种常见方法

《在PyQt加载UI三种常见方法》在PyQt中,加载UI文件通常指的是使用QtDesigner设计的.ui文件,并将其转换为Python代码,以便在PyQt应用程序中使用,这篇文章给大家介绍在... 目录方法一:使用 uic 模块动态加载 (不推荐用于大型项目)方法二:将 UI 文件编译为 python 模

Android与iOS设备MAC地址生成原理及Java实现详解

《Android与iOS设备MAC地址生成原理及Java实现详解》在无线网络通信中,MAC(MediaAccessControl)地址是设备的唯一网络标识符,本文主要介绍了Android与iOS设备M... 目录引言1. MAC地址基础1.1 MAC地址的组成1.2 MAC地址的分类2. android与I