UE5学习笔记 FPS游戏制作39 制作一个带有背景的预制面板 使用overlay和nameSlot

文章目录

制作面板

拖放UI

创建一个UI控件,命名为BGPanel,

添加一个覆层,但是当我们在一个面板上拖出这个控件时,覆层不能直接接受子物体

在覆层下添加一个图片和一个"命名的插槽",并将两者拉伸到全屏

这样,其他元素可以拖到这插槽里,缺点是子元素的大小只能和插槽相同,不能手动调整

制作图片可以设置的功能

当把这个控件拖到别的控件里后,图片无法直接修改属性,需要自己做设置图片的功能

打开事件图表,添加一个变量BackgroundImage,点开后边的眼睛,变成公开变量

我们可以在细节面板里给变量设置一个默认值

在预构造事件里添加如下节点,预构造是指编辑器阶段,不是在构造函数前运行

这样子,当把BGPanel拖到别的控件里时,就可以在默认栏里,设置图片的样式

制作ContentSlot居中对齐

当ContenSlot的子元素是text时,很可能需要居中对齐这个功能,但是ue的text本身不支持居中对齐,我们只能通过让父物体居中对齐来实现text的居中对齐

在事件图表里添加一个参数,类型选择EVerticalAlignment

在预构造事件里添加如下节点,注意这个"插槽"根据父容器不同,具体类型会不同,这里可以修改对齐方式是因为父容器"覆层"的插槽里有对齐方式的属性

当把BGPanel拖到别的控件里时,就可以在默认栏里,设置contentSlot的对齐方式

使用面板

创建一个MainMenu控件

将BGPanel拖入,然后将显示的内容拖入slot里,注意contentSlot里可以是任何元素,不一定是text

相关推荐
知识分享小能手2 分钟前
MongoDB入门学习教程,从入门到精通,MongoDB 持久性完全指南(20)
数据库·学习·mongodb
老鱼说AI5 分钟前
长文预警!大模型面试:关于大模型微调的进阶与工程部署讲解
人工智能·深度学习·神经网络·学习·自然语言处理·面试·职场和发展
2301_822703206 分钟前
鸿蒙flutter三方库适配——笔记与知识管理应用:Flutter Markdown实战
笔记·算法·flutter·华为·图形渲染·harmonyos·鸿蒙
北顾笙9809 小时前
LLM学习-day02
学习
大连好光景10 小时前
PYG从入门到放弃
笔记·学习
VelinX10 小时前
【个人学习||操作系统】
学习
renhongxia111 小时前
ORACLE-SWE:量化Oracle 信息信号对SWE代理的贡献
人工智能·深度学习·学习·语言模型·分类
AI_零食11 小时前
声音分贝模拟与波动动画展示:鸿蒙Flutter框架 实现的声音可视化应用
学习·flutter·华为·开源·harmonyos
Keep Running *11 小时前
Spring Cloud Alibaba_学习笔记
笔记·学习
我不是懒洋洋11 小时前
AI的影响6
笔记