UE5 UMG学习笔记

视频资料:https://www.bilibili.com/video/BV1aLdBYkEfs?spm_id_from=333.788.videopod.sections\&vd_source=707ec8983cc32e6e065d5496a7f79ee6

笔记1:UMG自适应

  • UMG有锚点的概念,可以根据左上角为锚点,来进行自适应布局
  • 制作大屏的互动多媒体时,也可以左上角为锚点,建立一个可以控制缩放的canvas,来缩放大小,并兼容一定的自适应

笔记2:Canvas

  • 为其他需要调整大小的组件,提供锚点,提供ZOrder等模式
  • 作用是规定了大小,模拟屏幕

笔记3:Overlay

  • 用作组件的叠加
  • 一个overlay里,可以加入很多组件,形成一个组合
  • 用作三维空间里UI

Canvas 可用作布局

Overlay 可用作一个固定的组合

笔记4:Vertical Box 垂直盒子

  • padding可以设置间隙
  • box是平铺布置的,不会叠加,相对位置稳定

笔记5:Grid Panel 栅格

  • 创建里面的组件后,可以点击组件边上的小箭头,移动到其他格子
  • row span是占的格子数
  • layer的作用和order类似,层级
  • Nudge,可以让格子偏移位置

笔记5:Uniform Grid 统一栅格

  • 统一栅格是简单的平分grid的空间
  • 点击size to content,根据内容调整大小
  • 可以规定最小大小

Uniform Grid 可用作列表的制作

Grid Panel 可用作布局

笔记6:Size Box 尺寸盒

  • 可用作图片的尺寸调整,要选择Size To Content
  • 固定尺寸、最小尺寸、最大尺寸
  • Aspect Ratio 是为防止过度拉伸,设置的拉伸比

笔记7:Scale Box 缩放盒

  • 在Border中,给到Text,但是Text内容增加,会超出Border
  • 给一个Scale Box后,字体就会自动缩放到合适尺寸

  • Stretching里,可以设置scale to fit,也可以设置裁剪等

笔记8:Wrap Box 包裹盒

  • 设置3个image在wrap box,随着box的缩小,最后一个image会跑到下面一行

  • 当把最后一个图片,设置成fill empty space时,它会填充后面的空间,用作一些标题栏很好
  • fill span when less then,当小于某值时,会自动对齐
  • force new line,换行

笔记9:Widget Switcher

  • 通过Active widget index来切换下面的哪一层
  • 可以用蓝图制作按钮来切换层
  • 形成层的互斥功能
  • 可以安装Common UI Plugin,里面有带简单动画功能的Switcher

https://blog.csdn.net/qq_17523181/article/details/140925013?spm=1011.2415.3001.5331

笔记10:根

  • Color And Opactiy:可以改变子类所有背景颜色
  • Foreground Color:可以改变最前层的背景颜色(需要点Inherit继承选项)
  • Preview Background:可以放一张预览图片,用于开发的时对照

笔记11:UI的大小和位置控制

  • 几乎所有的UI大小和位置,都是由它的父类控制的
  • 一张canvas下图片,有2种大小控制方式,1是由图片的slot(canvas)来控制大小,2是点sizeToContent,才由image size来控制大小
  • horizontal box下的图片,如果auto,由图片大小控制,如果是fill,由box来控制大小

笔记12:Scroll Box

  • 可以设置横向或纵向
  • 可以设置滚动条的一些样式
  • 可以设置动画滚动,更加丝滑
  • 不可以设置无限循环滚动,可以制作向下无限滚动的功能,把内容设置2份,或多出一些;然后滚动大于一个距离时,直接跳转到0

笔记13:Image

  • 可以设置Draw As,边框图;box类似于9宫格的图片,中间拉伸
  • 可以设置Tilling,来设置平铺

笔记14:Slider 滑块

  • 可以用图片替换滑块,可以设置轴的样式(同样可以用图片)

笔记15:ProgressBar 进度条

  • 设置is marquee,设置marquee,让进度条变成一个流动动画的线条

笔记16:Border 边框

  • 只能一个子类
  • 可以设置边框

笔记17:Named Slot 插槽

  • 插槽可以布局好结构,然后再在结构里放入一个子类
  • 在插槽里,追加内容

笔记18:Transform

  • 在动画使用Transform做比较好用
  • is volatile,和缓存有关,如果是图片是动态的,可以点击

笔记19:Spin Box

  • 一个数字范围控制的盒子

笔记20:Throbber

  • 一个表示动态加载的图形
  • Circular Throbber,加载的动态圈圈

笔记21:Multi TextBox

  • 多行文本

笔记22:Combo Box

  • 有Key和String 2种,一个是string返回,一个是name格式返回

笔记23:MenuAnchor 菜单锚点

  • 可以选择一个umg蓝图,并通过蓝图点击打开或关闭

笔记24:Spacer 空格

  • 用作水平盒子或垂直盒子里

感谢教程作者冰火百科老师的讲解,声音好听,逻辑清晰,也祝福大家学习愉快

相关推荐
世人万千丶1 天前
Flutter 框架跨平台鸿蒙开发 - 恐惧清单应用
学习·flutter·华为·开源·harmonyos·鸿蒙
yuzhuanhei1 天前
Visual Studio 配置C++opencv
c++·学习·visual studio
一轮弯弯的明月1 天前
贝尔数求集合划分方案总数
java·笔记·蓝桥杯·学习心得
此刻觐神1 天前
IMX6ULL开发板学习-01(Linux文件目录和目录相关命令)
linux·服务器·学习
憧憬从前1 天前
算法学习记录DAY2
学习
航Hang*1 天前
第3章:Linux系统安全管理——第2节:部署代理服务
linux·运维·服务器·开发语言·笔记·系统安全
babe小鑫1 天前
会计岗位学习数据分析的价值分析
学习·数据挖掘·数据分析
千枫s1 天前
电脑vm虚拟机kali linux安装shannon
学习·网络安全
zjnlswd1 天前
tkinter学习案例--笔记代码
笔记·学习
咬_咬1 天前
go语言学习(基本数据类型)
开发语言·学习·golang·数据类型