UE4_用户控件_9_用按钮来控制播放动画

UE4学习笔记:学习UE4中的UMG(图形UI设计器)工具(四):UMG中的动画 学习完了各自控件及操作后来了解控件蓝图中的动画功能 一.简单的UI动画 我们先来接触控件蓝图左下角的动画面板,首先在视觉界面中添加一个Image控件,并设置图片 在动画面板中单击+Animation,添加一个动画轨 在Timeline时间轴中单机+Track,并在列表中选择之前的创建的Image控件 现在就可以为Image控件添加关键帧了,我们想要实现一个简单的动画,让Image控件可以左右移... 阅读详情

祝愿大美兰陵越来越好。

一、效果展示:

二、用户控件的编辑

1、新建控件蓝图,更名为UMG_Animation。

2、双击打开编辑UMG_Animation。拖拽图像,更名为background,调整参数。

效果如下:

3、再拖拽一张图像作为logo,可用UE4logo。

4、为上面的图像新建个材质,更名为M_Logo_2。

双击打开进行编辑,设置材质域为用户界面,这样就可以作为图像使用。还需要不透明度的参数,所以把混合模式更改为已遮罩。

材质节点就变成这样的了

添加纹理采样节点,选择ue4logo

5、把材质赋予图像。

效果如下图:

6、拖拽个水平框用于存放水平方向上的一排按钮。

效果如下图:

7、在水平框中放2个按钮。如下图:

调整参数,样式如下图:

8、动画面板中添加动画,更名为Scale。

轨道上添加图像名为logo的图像

给图像的变换制作关键帧动画

关键帧添加如下:

缩放关键帧数值变化:(1.0,1.0)—>(0.9,1.5)—>(1.0,1.0)。

9、动画面板中继续添加动画,命名为Bounce。

还是对图像logo进行处理:

10、现在来进行用户控件事件图表的编辑。

选择ScaleButton按钮,添加点击时事件

我们需要用2个布尔变量来控制下现在到底是在缩放还是在弹跳

情况分类如下:

(1)当正在缩放时,单击ScaleButton按钮时,停止播放缩放动画。

(2)当没进行缩放时,单击ScaleButton按钮时,播放缩放动画。

另一个按钮单击事件类似,不在陈述。

 三、我们需要一个角色

1、新建个父类为pawn的蓝图类。更名为BP_Image_Character。

2、这个角色只是用于观察场景,并与场景中的物体相碰撞用的,所以不需要骨骼网格体,

3、但是我们需要响应键盘和鼠标事件,可以把第三人称角色复制过来,这样角色就能移动了。

4、我们需要角色与胶囊体不同实例碰撞时创建不同的用户控件,所以这里得需要一个用户控件类得引用型变量。

5、我们自定义一个显示控件的事件

发现控件类图类的引用和用户控类引用不兼容,修改变量类型。

我们需要添加到视口,同时设置输入模式。

6、同样我们需要一个把它清楚的自定义事件

7、因为所有控件的退出按钮是一样的,所以这里创建一个公共的退出按钮。

创建按钮的点击事件,当点击时调用角色的自定义事件clearwidget。

四、新建个GameMode

在 UE4 中,每一个世界(World)有多个 Level(关卡),而每个关卡又可以设定自己的 GameMode(游戏模式),从而控制游戏的玩法。

1、新建个GameMode。更名为BP_Gamemode。

2、设置游戏模式默认角色为BP_Image_Character。

3、关卡设置

项目设置不动

测试下:

无问题。

五、我们需要触发器

 1、新建一个actor蓝图类,

2、添加一个胶囊体碰撞

大小设置为:

3、添加事件Actor开始重叠事件

4、先检测一下是不是我们的角色碰撞的

5、如果是他的话,我们需要把创建的用户控件类的引用传递给角色的UMGClassName。好让角色知道应该创建的是谁。

这里同样需要一个这个类型的变量UMGClassName1

6、我们需要把用户控件类的引用给角色传递过去

7、因为这里的UMGClassName1,需要把这个触发器拖到场景中,根据它所在的位置来决定触发生成哪一个控件,所以不同的实例创建的控件是不同的,这样我们就需要根据位置来设置UMGClassName1的值,这样这个变量就需要公开。

变量为公有,就可在此蓝图的每个实例上进行编辑。

8、这样我们就可以调用显示控件的自定义事件了。

测试一下:

可以了,但是没有退出控件,没有鼠标,所以改进一下。

六、改进

角色中showwidget时,把退出控件加上

运行效果:

同时你会发现,当用户界面生成时,没有鼠标,角色还是到处跑,这样可以用变量进行控制。

清除控件的时候要隐藏鼠标

再添加个变量来控制当控件添加的时候,让角色不动。

测试:

UE4_官方动画内容示例1.2_动画蓝图——使用蓝图告知Actor播放动画 展示了两个示例:在其中一个示例中,使用蓝图告知Actor播放动画,在另外一个示例中,展示了告知Actor播放动画的动画蓝图(例如,此示例展示了如何将变量从蓝图传递给动画蓝图,并演示了如何将现有姿势混合到新动画中)。 阅读详情

相关推荐

虚幻引擎UMG控件蓝图实战:从零构建动态HUD界面

在游戏开发与交互应用构建中,用户界面(UI)是连接用户与虚拟世界的核心桥梁,其实现依赖于一套完整的UI框架。虚幻引擎的UMG(Unreal Motion Graphics)系统提供了强大的可视化UI创作工具集,而控件蓝图(Widget Blueprint)则是该框架中实现具体界面交互逻辑的基石。其工作原理基于事件驱动与数据绑定,允许开发者将游戏逻辑数据(如角色状态)实时映射到界面元素上,并通过蓝图可视化脚本响应交互事件。这一技术方案的价值在于显著提升了UI开发的效率与灵活性,使开发者能够快速构建出复杂、响应

weixin_33700350的博客 367

UE4随笔—— UMG动画的实现方法

** UMG动画的实现方法 ** 背景: 在进行应用开发时,我们有时候需要对UMG 进行一些动画设计。比如 button 从底部移动到顶部,伴随着颜色的变化,伴随着透明度的变化。 测试平台:UE4 4.24 纯蓝图 测试步骤: 先看一下 名称对应的 UMG . 1,添加动画 直接点击, 自动创建一个动画。 我们自己命名 TestAnimation 2, 添加需要追踪的模块 先点击需...

gaofei7439的博客 4941

虚幻商城UI_Material_Lab实战:不写代码快速实现高级UI粒子特效(UE4/5通用版)

本文详细介绍了在虚幻引擎(UE4/UE5)中,无需编写代码即可快速实现高级UI粒子特效的实战方法。通过利用Niagara粒子系统、渲染目标和UMG材质,开发者可以创建动态、可交互且性能高效的UI界面特效,完美替代传统的视频序列方案,大幅提升视觉表现力和开发效率。

weixin_29011395的博客 411

阿赵UE学习笔记——24、动画播放控制

继续学习虚幻引擎的使用。关于UE的动画系统,之前学习了很多,包括动画合成或者动画蒙太奇等,实际上最后得到的都是一个动画片段。那么这些动画片段,是需要怎样播放控制呢?这里先学习一下不借助动画状态机的播放,下一篇再学习动画状态机的用法。

阿赵的博客 3222

虚幻引擎UI进阶:自定义按钮样式与交互反馈全流程指南

在游戏开发中,用户界面(UI)是连接玩家与游戏世界的直接桥梁,其交互体验的流畅度与视觉反馈的细腻程度,深刻影响着游戏的整体品质。UI设计的核心原理在于通过视觉与听觉的即时反馈,建立清晰的操作映射与状态提示,从而降低玩家的认知负荷,维持沉浸感。从技术实现层面,这涉及到控件状态管理、资源调度与事件响应机制的协同工作。在虚幻引擎(UE)的生态中,控件蓝图(Widget Blueprint)作为构建UI的核心工具,其样式系统(Style)与事件驱动架构为高效、可维护的UI开发提供了坚实基础。通过样式表(Style)

weixin_30753873的博客 522

UE4/UE5 UMG ScaleBox控件详解:图片自适应布局原理与实战应用

在UI开发中,内容自适应布局是确保跨设备、跨分辨率一致体验的核心技术。其原理在于通过算法动态计算容器与内容之间的尺寸关系,并应用相应的缩放与对齐策略,以解决因屏幕宽高比差异导致的拉伸、裁剪或留边问题。这项技术的价值在于提升UI的视觉保真度与交互一致性,是构建响应式界面的基础。在游戏开发、应用软件及Web前端等领域,它被广泛应用于全屏背景、图标展示、动态画中画等场景。本文聚焦于UE4/UE5的UMG系统,深入解析其内置的ScaleBox控件如何实现多种拉伸模式(如Fit、Fill),并结合性能优化与常见陷阱,

weixin_34408624的博客 426

UE5【UMG】 - Simple Menu UI v3 学习笔记

UE5,UMG插件学习笔记,了解UI的做法

Unity、UE5开发 2214

Qt编写自定义控件:动态效果按钮

具体来说,当鼠标移至按钮上方时,我们将启动一个从 1.0 缩放至 1.2 的动画;首先,我们需要新建一个 Qt 工程,并在工程中添加一个新的 QWidget 类,该类将作为我们自定义控件的基类。接下来,我们需要在该类中实现按钮的基本功能,包括按钮的绘制、鼠标事件处理等。在这个基础上,我们新增一个名为“AnimatedButton”的类,它将从 QWidget 继承,并添加额外的特性。最后,我们在窗口中添加 AnimatedButton 控件,并设置其样式和相应的操作。Qt编写自定义控件:动态效果按钮。

ByteWhizX的博客 688

虚幻引擎(23)-游戏背景音乐

使用的虚幻引擎版本:4.23.1 实现的功能:游戏背景音乐

害怕也得前进 3701

手把手教你用RMII接口配置以太网PHY芯片(附YT8512实战代码)

本文详细介绍了如何使用RMII接口配置以太网PHY芯片,以国产YT8512为例,提供从硬件设计到软件驱动的全流程实战指南。内容包括RMII接口技术解析、YT8512硬件设计要点、驱动开发实战代码及常见问题排查,帮助开发者快速实现以太网通信功能。

mac99的博客 995

Java 开发 修改【冒险岛 079 私服】完整学习流程

第 1-2 天:环境搭建 + 运行原版 079 服务端,能正常登录游戏;第 3-4 天:纯配置文件修改,掌握倍率、属性、怪物、道具的修改,改出第一个「百倍经验私服」;第 5-10 天:Java 代码基础修改,掌握 Player/Skill/Monster 核心类的修改,实现技能无冷却、一刀秒怪、升级满属性;第 11-20 天:Java 代码进阶修改,掌握业务逻辑修改,实现死亡不掉经验、自动捡物、装备强化无失败;第 21-30 天。

萧曳丶 3893

UE5 基础应用 —— 05 - 控件蓝图 简单使用

UI全称 User Interface (用户界面)。开始菜单界面、设置界面、背包界面等等都属于 UI 界面。在 UE3 / UE4 时期,HUD(Head-Up Display)就是主要的 UI 系统,但使用起来比较麻烦,需要自己编写绘制逻辑。在 UE4 之后,Epic 推出了 UMG(Unreal Motion Graphics UI Designer),更直观强大。可以拖拽按钮、文本、图片,像在 Photoshop 或 Unity 的 UI 系统里那样设计界面。

CandyU2的博客 3685

【Nordic实战】nRF54L15引脚规划:电源域、专用引脚与低功耗设计避坑指南

本文深入解析Nordic nRF54L15芯片的引脚规划策略,重点阐述其基于电源域(MCU域、PERI域、LP域)的GPIO分配原则。文章提供了从思维转变到实战避坑的完整指南,强调遵循专用引脚与域对应关系是实现超低功耗设计的关键,并分享了系统化的引脚规划流程与工具使用建议。

weixin_29192141的博客 321

PowerBuilder 9实现FLASH动画播放(转)

PowerBuilder数据库编程中利用Flash控件进行动画播放和控制播放的方法。 关键词 OLE控件 动画 Flash PB 1. 前言PowerBuilder(以下简称PB)是一种面向对象、快速开发数据库的开发平台...

cuankuangzhong6373的博客 257

光耦CTR参数实战:如何避免误触发与功耗陷阱(附计算公式)

本文深入解析光耦CTR参数在电路设计中的关键作用,探讨如何平衡误触发风险与功耗表现。通过TLP521、PC817等常见型号的实测数据对比,提供不同工作状态下的选型策略和计算公式,帮助工程师优化设计,提升系统稳定性和能效。

2a4s6d8f0g的博客 323

RK3308B开发板WiFi+蓝牙一体模组RTL8821CS驱动移植保姆级教程(含DTS配置与避坑点)

本文提供RK3308B开发板RTL8821CS WiFi+蓝牙模组驱动移植的完整教程,涵盖SDK环境配置、DTS设备树设置、内核编译优化及功能验证全流程。重点解析引脚复用冲突、电源管理等关键配置,并给出常见错误解决方案,帮助开发者快速实现双模通信功能。

weixin_42531163的博客 398

QML播放条控件

该播放条控件能够根据设置的起始时间,提供播放、暂停、变速播放、前进、倒退、滑动条控制,状态显示等功能,控件如图:

zjgo007的专栏 1224

【WRF-Chem教程第四期上】运行 WRF-Chem 模型

完整介绍运行 WRF-Chem 模型的详细步骤

WW、forever的博客 3111

powerBuilder 9实现FLASH动画播放(转)

powerBuilder 9实现FLASH动画播放 PowerBuilder实现FLASH动画播放 PowerBuilder数据库编程中利用Flash控件进行动画播放和控制播放的方法。 关键词 OLE控件 动画 Flash PB...

congli3478的博客 162

MIPI D-PHY TX 一致性测试实例解析 Part 01 续

本文为MIPI D-PHY TX一致性测试实例解析part01章节的第二部分

一只豌豆象的博客 6042

i.MX6ULL系统移植 | 使用busybox制作根文件系统(1.29.0)

一. 下载BusyBox BusyBox是一个继承了大量Linux命令核工具的软件,像常用的ls、cp、mv、ifconfig等命令。一般下载BusyBox的源码,然后配置Busybox,选择自己想要的功能,最后编译即可。 BusyBox在官方可以直接下载:https://www.busybox.net/。目前最新是1.35.0,这里我使用1.29.0版本。 axel https://www.busybox.net/downloads/busybox-1.29.0.tar.bz2 下载之后解压: tar

Mculover666的博客(嵌入式) 1145

多媒体播放 && 自定义播放控件

一.音频 <audio src="./video.mp3" controls></audio> 音频的属性 属性 值 说明 controls controls 如果出现该属性,则向用户显示控件,比如播放按钮 autoplay autoplay 如果出现该属性,则音频在就绪后马上播放 [自动播放] loop loop 如果出现该属性,则当音频结束时重新开始播放 [循环播放] preload auto/meta/none 如果出现该属性,则音频在页面加载时进

m0_54572778的博客 436

Outlook Express 6 (OE6) for Win7/Win8/Win10

英文版 Outlook Express6.0, 兼容Win7/Win10/WinXP,解压就可用。

js实现点击音频实现播放功能

HTML,CSS,JavaScript模拟音频

BANaanaa的博客 1355

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

SIMATIC S7-1200, S7-1500 PID 控制[手册]

SIMATIC S7-1200, S7-1500 PID 控制[手册]

UE5 2D游戏开发实战:从Paper2D插件到完整项目构建

2D游戏开发是游戏制作的基础领域,其核心在于通过精灵、动画序列与物理碰撞等元素构建二维交互世界。在技术原理上,现代游戏引擎通过专门的2D渲染管线与物理系统来处理这些元素,其中精灵表(Sprite Sheets)、瓦片地图(Tile Maps)和动画状态机是关键组件。从技术价值看,成熟的2D工作流能极大提升开发效率,支持快速原型验证与跨平台发布。在应用场景方面,2D技术广泛应用于横版平台、俯视角、策略及独立游戏开发。聚焦到虚幻引擎5(UE5),其内置的Paper2D插件与社区工具链(如PaperZD)提供了完

weixin_34378969的博客 414

IDEA的使用指南

IDEA基于java的使用手册,可以最快速的上手,在使用中不断的丰富自己的使用技巧.

Android 按钮使用json动效

在Android开发中,如果想使用JSON格式的文件来定义和控制按钮的动画效果,可以通过Lottie库来实现。Lottie是一个开源库,能够解析Adobe After Effects导出的JSON动画文件,并在Android、iOS、Web等多个平台上原生渲染这些动画。 以下是使用Lottie实现按钮动效的基本步骤: 1....

weixin_42447681的博客 594
上一篇: UE4_用户控件_10_用图像来显示场景捕获的渲染目标
下一篇: UE4_用户控件_3_用户控件输入数据的方法
Growthofnotes
博客等级 码龄5年 0粉丝 143原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Growthofnotes

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值