文章目录
- 前言
- 相关链接
- Canvasitem:画布
- Control:UI布局基类
- Container:布局容器基类
- BaseButton:按钮基类
- TextEdit:富文本编辑
- ColorRect:颜色矩形
- Range:数据范围范围UI基类
- Separator:分割线
- ItemList:列表控件
- Label:文本框
- LineEdit:文本输入框
- MenuBar:没搞懂
- NinePatchRect:没搞懂
- Panel:没搞懂
- ReferenceRect:分割框
- RichTextLabel:富文本
- TabBar:简单选项卡
- TextureRect:材质矩形
- Tree:不了解
- VideoStreamPlayer:播放视频
- 总结
前言
布局容器是非常重要的,我们一般在布局容器进行对用户的交互
相关链接
Canvasitem:画布
Control的基类。主要是有一个visiable。是否可视化。这个就方便我们静态挂载
![](https://file.jishuzhan.net/article/1779441776428322817/65397d949597a2bdae4fc29afd41543e.webp)
Control:UI布局基类
UI布局的基类
Tooltip:悬浮提示
FontSize 文本大小
![](https://file.jishuzhan.net/article/1779441776428322817/e19859fb40b4036c5eb51c11f5a76b9d.webp)
Container:布局容器基类
不挂载脚本无法使用
AspectRatioContainer:伸缩居中布局
BoxContainer:盒子布局
HBoxContainer / VBoxContainer 就是确定了排列方向的BoxContainer
ColorPicker:取色器
![](https://file.jishuzhan.net/article/1779441776428322817/7002f6a6675ee17b0c6e668e48dea76b.webp)
![](https://file.jishuzhan.net/article/1779441776428322817/b4faaad1e51a754bb517c13b2ed62f9f.webp)
CenterContainer:不伸缩居中
![](https://file.jishuzhan.net/article/1779441776428322817/0d1fe05591f994625cd3b30cf6fd852f.webp)
FlowContainer:自动换行布局
![](https://file.jishuzhan.net/article/1779441776428322817/26be1cbd44d004792a1a74e75925e0e4.webp)
![](https://file.jishuzhan.net/article/1779441776428322817/3e9cc9e323d71f58f3cc367490aa1a2c.webp)
GridContainer:分割布局
![](https://file.jishuzhan.net/article/1779441776428322817/1dcf78c857f6bb835c1caadfd80fffcd.webp)
![](https://file.jishuzhan.net/article/1779441776428322817/8a2a5add156ee2d8d29a3c50dd95ee6f.webp)
SplitContainer:填充分割布局
![](https://file.jishuzhan.net/article/1779441776428322817/f3898f9d26f4dcbc4e7aafbc1ebcfc41.webp)
![](https://file.jishuzhan.net/article/1779441776428322817/9f4f573032036994401215aa67091a79.webp)
MarginContainer:边距布局
ScrollContainer:滚动布局
![](https://file.jishuzhan.net/article/1779441776428322817/c4ca559ccb56fc19330409d82505d2ba.webp)
![](https://file.jishuzhan.net/article/1779441776428322817/8efcdf03bdf5b27aa8a53a81b22d4693.webp)
TabContainer:切换栏
![](https://file.jishuzhan.net/article/1779441776428322817/d20ff8b1e5148caefeac2ba664be826b.webp)
BaseButton:按钮基类
Button:简单的按钮
![](https://file.jishuzhan.net/article/1779441776428322817/c5df13e6bcc8b04b8afb07b1c16bce29.webp)
CheckBox
CheckBox的复选框大小无法修改。
CheckButton
ColorPickerButton:折叠起来的颜色选取
MenuButton:折叠选项
![](https://file.jishuzhan.net/article/1779441776428322817/7e441badab4cd545c4bd9561d8e99380.webp)
OptionButton:下拉选项
![](https://file.jishuzhan.net/article/1779441776428322817/70d73cef1838dd54155f787f1e214113.webp)
![](https://file.jishuzhan.net/article/1779441776428322817/70c363185328bfef3b8b796a73fbd57b.webp)
TextEdit:富文本编辑
ColorRect:颜色矩形
![](https://file.jishuzhan.net/article/1779441776428322817/f60d5f1a1d10868996d7c5b8dde3061d.webp)
![](https://file.jishuzhan.net/article/1779441776428322817/8c15d8311ba6c787ee00cdef0822db91.webp)
Range:数据范围范围UI基类
ScrollBar:滑块基类
HScrollBar:横向滑块
VScrollBar:垂直滑块
Slider:滑动条基类
HSlider:横向滑动条
VSlider:竖向滑动条
ProgressBar:进度百分比
SpinBox:单步数字
![](https://file.jishuzhan.net/article/1779441776428322817/8a53a484d85ecfe97aab8adeee220abe.webp)
![](https://file.jishuzhan.net/article/1779441776428322817/09be333e22770812d08502ba85075fa2.webp)
TextureProgressBar:不会用
Separator:分割线
HSeparator:水平分割线
![](https://file.jishuzhan.net/article/1779441776428322817/e51ae5acd409ed76dfce7bd3e78546c9.webp)
VSeparator:垂直分割线
同上
ItemList:列表控件
![](https://file.jishuzhan.net/article/1779441776428322817/2af41f51f68a1417e246a7bf1eb1e6fe.webp)
Label:文本框
![](https://file.jishuzhan.net/article/1779441776428322817/401fd48156e14ab2cf2041cd81c6cce7.webp)
LineEdit:文本输入框
![](https://file.jishuzhan.net/article/1779441776428322817/19fd4bd78e0059b54c62bae584710e72.webp)
MenuBar:没搞懂
NinePatchRect:没搞懂
Panel:没搞懂
ReferenceRect:分割框
![](https://file.jishuzhan.net/article/1779441776428322817/18ea3723deeb89ceb9c3b263f7c19bd1.webp)
RichTextLabel:富文本
![](https://file.jishuzhan.net/article/1779441776428322817/8d0cbdc0ef3b9145104e9b9c31d3cdfd.webp)
TabBar:简单选项卡
只显示选项卡,不负责子元素交互
![](https://file.jishuzhan.net/article/1779441776428322817/53ae36c670707e30613d84b877ec23f8.webp)
TextureRect:材质矩形
![](https://file.jishuzhan.net/article/1779441776428322817/f073b645bb00e3ad1baf4a255caa16ac.webp)
Tree:不了解
VideoStreamPlayer:播放视频
跳过
总结
UI布局是非常通用的,无论是2D还是3D。但是Godot 的3D还处于开发中的状态,2D已经够用了,但是3D 目前还是不如Unity的。