Godot虽然有内置文档和在线文档，但是对于特定控件的讲解资料是很少的。因此对于使用者可能会造成一定困扰。

笔者（Bilibili@巽星石）一直想实现一个Godot控件的详细教程，为了实现这个目的，我会开始一系列的文章来进行总结，并不断地修改，以便于读者食用。

本篇主要介绍按钮类型控件的基础使用和自定义等。

注意：本篇所述内容皆基于Godot4.2.1版本，不同大小版本下可能会有API的差异。

Button是最基础的按钮控件，也是日常最常用的按钮类型。其继承和派生关系如下图：

在“检视器”面板你可以看到Button类型的属性：

text属性设定按钮显示的文本，我们可以在“检视器”面板中直接设定，也可以通过代码来设定。

通过alignment属性可以设定按钮文本在按钮矩形区域中的对齐方式。可以直接在“检视器”面板中选择，三个选项分别对应左对齐、居中和右对齐。默认文本对齐方式为居中。

或者也可以用代码的形式进行设定：

分别对应效果如下：

因为text属性没有限定文本的长度，所以一定会出现文本超出按钮长度的情况。

下图为设定text_overrun_behavior属性：

下图为设定clip_text属性：

或者也可以使用代码形式：

下面分别是未进行文本裁剪和进行裁剪的效果：

以下是常见的几种文本和图标位置关系：

在创建复杂的自定义节点或编辑器插件时，可能需要动态生成按钮，这时使用重复性的代码，就不如直接编写函数或函数库。

上面的4种按钮，可以看做是普通按钮的变体（特殊版本），我们可以通过对应的4个函数来快速生成，外加一种只有文本的按钮，就是5种按钮，5个函数。

我们为一个HBoxContainer添加用按钮生成函数动态生成的各种按钮。

代码如下：

运行后可以看到生成的按钮效果：

在创建类似工具栏的程序界面时，按钮可以只设定图标，不设定文本，相应的可以设定鼠标提示文本来提示按钮的作用。

Godot编辑器中这种工具栏的设计比比皆是。你也可以在你的Godot桌面应用程序或Godot编辑器插件中使用这种工具栏设计。

同样的我们可以为这种类型的按钮创建生成函数。

图标跟随按钮放大的效果：

Button继承自按钮基类BaseButton，它提供了所有按钮类型共用的一些基础属性、方法和信号。

以下是BaseButton类型的属性：

以下是按钮类型拥有的4个信号：

因为这是一个多选项，所以你可以选择至少一个或两个或全部三个按键。用代码进行设定时，可以使用|符号分割多个选项。

通过为多个按钮的button_group属性创建同一个ButtonGroup资源，可以将多个按钮联系在一起，形成一个按钮组。

按钮组的特性是：同一时间只有一个按钮能被按下。

创建按钮组的前提：按钮组中的所有按钮都启用了toggle_mode。

我们可以用以下3种方式手动创建按钮组：

运行后就会发现三个按钮只有一个按钮能被按下，类似于在多个可选项中进行单选。

按钮组通常可以用于游戏设定，以及UI界面中简单的标签页效果。

我们以为可以用代码方式创建按钮组，甚至你可以编写函数来生成一个按钮组。

下面是一个简单的按钮组生成函数：

我们通过一个HboxContainer节点，添加这个按钮组： 我们为其添加如下代码：

实际运行效果与手动创建无异。

上面只是创建了Button类型的按钮组生成函数，你也可以继续扩展创建其他按钮类型的按钮组生成函数。或者写一个支持所有按钮类型的按钮组生成函数。

我们为按钮添加一段鼠标提示文本。

再次运行可以看到带有鼠标提示文本和快捷键提示的效果。

因此按钮本身也是控件，所以Control类型自然在其继承链上，这意为着按钮可以使用继承自Control类型的属性、方法和信号。

在上面我们已经提到过按钮与鼠标交互时的几种状态切换，也就是下表列出的5种。

相应的我们可以在主题覆盖部分，设定按钮在五种状态下的“样式盒”（边框、背景、内外边距、圆角等）、文本以及图标的颜色。

同样是在样式覆盖部分，可以自定义按钮的字体和字号。

通过两个属性的结合，可以实现按钮文本的描边效果。

在样式覆盖的常量部分，可以通过icon_max_width设定按钮图标的最大宽度。

在Godot中我们同样可以为我们的控件设定焦点顺序和上下左右的毗邻控件：

运行后，可以看到默认中键按钮获得焦点，通过键盘左右上下键可以控制焦点在几个按钮间切换。

更常见的一种情况是，我们需要为多个并排的按钮添加焦点顺序，通过为按钮设定focus_next或focus_previous，可以将多个按钮连起来，实现焦点顺序。

这里我们以三个竖向并列的按钮为例：

我们通过如下代码，实现三个按钮的焦点顺序：

运行后，默认还是第一个按钮获得焦点，我们使用Tab键或下方向键进行按钮焦点的正序切换。当达到末尾时，焦点又会重新回到第一个按钮，如此循环。

我们使用Shift+Tab键或上方向键，可以进行按钮焦点的逆序切换。也就是向上切换，同样到顶之后，又会回到焦点顺序最末尾的按钮。

Button派生的有4个按钮子类型，同时BaseButton直接派生的还有2个按钮子类型。

CheckButton类似于一个开关。它类似于一个开启了flat的按钮后面跟了一个表示按下或未按下（也可以理解为选中或未选中）的图标。

使用CheckButton生成函数：

生成的CheckButton效果:

MenuButton是一种特殊按钮，点击后会弹出一个下拉菜单。

通过其items属性，我们可以设定每个菜单项。

运行后的效果如下：

也可以为每个菜单项设定图标，以及是否可以勾选并显示复选框或单选框。

通过添加separator属性为true的菜单项，可以添加菜单项之间的分割线，用于菜单项的人为分组。

运行后的效果如下：

#==========================================================# 等待继续扩充…

最后修改日期：2024年2月27日00:39:58 #==========================================================#