在本指南中，我将介绍 Godot 4 中的所有 9 种按钮、ButtonGroup 和 ColorPicker（如果你们希望我也介绍滑块、滚动条及其他节点，可以留言，或者你们也可以分享自己关于按钮或 Control 节点的使用技巧，我会将其添加到后续章节中）。 这是基础内容，将解析按钮（Base button）的属性和信号。 我们从所有按钮共有的基本属性和信号开始，这些可以在检查器的 base button 部分找到。 Base button 的属性：

1. **禁用（Disabled）**：按钮禁用/锁定 若启用此选项，将无法点击按钮或通过快捷键触发该按钮。 2. **切换模式（Toggle Mode）**： 若启用此选项，按钮将作为切换开关使用（开启/关闭）。 3. **按下状态（Pressed）**： 按下或按住按钮时，状态会从0变为1（仅在“切换模式”启用时，可在检查器中开启此选项）。 4. **动作模式（Action Mode）**： - **按钮按下（Button Press）**：在按下按钮时触发功能。按钮释放（Button Release）– 在松开按钮时生效。 5. 按钮触发方式（Button Mask）– 可用于按下按钮的方式 鼠标左键/右键/中键（Mouse Left/Right/Middle，希望这里都能明白） 6. 鼠标移出保持按下状态（Keep Pressed Outside）– 这只是视觉效果： 启用后，如果按住鼠标点击并将光标移出按钮范围，按钮在视觉上会保持按下状态。 7. 按钮组（Button Group）将在下方详细说明…… 8. 快捷键（Shortcut）– 为按钮分配的热键 9.快捷键反馈 – 按下热键时按钮按下的视觉显示 10. 工具提示中的快捷键 – 鼠标悬停在按钮上时高亮显示热键。 基础按钮信号：

1. button_down() – 在按下按钮时触发。 2. button_up() – 在释放按钮时触发。 3. pressed() – 根据操作模式（Action Mode）的不同，其作用等同于前两者：若为“按钮按下（Button Press）”模式，则等同于button_down()；若为“按钮释放（Button Release）”模式，则等同于button_up()。 4. toggled(toggled_on: bool) – 仅在启用切换模式（Toggle Mode）时生效，通过toggled_on参数返回true或false，具体取决于按钮的按下状态。基础按钮的方法（函数）：（在实际应用中会有多个现成的解决方案）通常来说，这部分内容用于按钮的视觉显示、逻辑处理以及其他交互功能。

1. func _pressed() – 当按钮被按下时调用。 2. func _toggle(toggled_on) – 每次按钮状态改变时调用（仅在 toggle_mode = 1 模式下生效） 3. get_draw_mode() – 显示按钮当前状态，范围为 0 到 4 枚举 DrawMode { 0 DRAW_NORMAL, # 普通状态 1 DRAW_PRESSED, # 已按下 2 DRAW_HOVER, # 鼠标悬停在按钮上 3 DRAW_DISABLED, # 已禁用 4 DRAW_HOVER_PRESSED # 按下状态 + 鼠标悬停（仅适用于 toggle_mode 1） } 4. is_hovered() – 显示鼠标是否悬停在按钮上 5.set_pressed_no_signal(true/false)——此函数用于切换按钮，并将其外观更改为您在括号中指定的样式。**不会触发任何按钮信号，也不会调用任何按钮函数。** 请注意，**如果禁用了切换模式（Toggle_mode）或启用了禁用状态（Disabled），该函数将无法正常工作**，简单来说，要调用此函数，按钮必须是切换按钮且未被锁定。就是个按钮（Button） 就是个按钮，没什么好说的，但可以进行一些小的自定义。好吧，我先讲讲它的属性和方法，然后再展示几种通过检查器或代码进一步美化的方法。

1. 文本 – текст（还需要我添加些什么吗？）。 2. 图标 – иконка，若按钮上有文字，则文字将位于图标旁。 3. 扁平 – 按钮变为透明状态，不显示自身主题（仅在按下时显示轮廓、文字及图标）。 4. 文本行为 – 此类别下的所有功能均用于文本的设置与调整。 1. 对齐方式 – 文本对齐：左对齐/居中对齐/右对齐。 2.文本溢出行为 – 当文本占用空间大于按钮时的表现： 1.Trim Nothing – 不进行裁剪 2.Trim Characters – 逐字符裁剪 3.Trim Words – 按单词裁剪 4.Ellipsis – 显示省略号 (...) 5.Word Ellipsis – 按单词裁剪并显示省略号 3. 裁剪文本（Clip Text）– 固定按钮尺寸，即使文本内容超出按钮范围，按钮也不会改变自身大小。 5. 图标行为（Icon Behavior）– 此类别下的所有设置均用于图标配置和调整。 1.1. **图标对齐**：定义按钮内图标的水平对齐方式：Left/Center/Right – 左对齐/居中/右对齐。 2. **图标垂直对齐**：定义按钮内图标的垂直对齐方式：Top/Center/Bottom – 顶端对齐/居中/底端对齐。 3. **扩展图标**：在保持图标比例的情况下，将图标拉伸至按钮大小。 6.BiDi - 可将文本书写方向在从右到左和从左到右之间切换，仅适用于支持该功能的语言，例如阿拉伯语（这是一个你几乎不会用到的功能）。 实践 - 点击按钮时更改按钮样式并添加快捷键 下面我将编写一个脚本，用于在点击按钮时更改文本和图标，并为按钮设置快捷键。（出于某种原因，无法在主题覆盖的图标选项卡中，像CheckBox或CheckButton那样对标准按钮设置变化的精灵图） 结果如下：

这是我的检查器的样子

这是我的脚本（我在里面留了注释，所以你们能看懂）

用于复制：extends Button # 将精灵加载到变量中 var button_icon_pressed = load("res://精灵/面包三角形_按下.png") var button_icon_default = load("res://精灵/面包三角形.png") # 按钮按下时执行的操作 func _pressed(): # 每次按下按钮时文本切换（在检查器的Text中显示为button） text = "面包" if text == "button" else "button" # 每次按下按钮时图标切换（在检查器的Icon中显示为хлебный_треугольник。icon = 若 icon == button_icon_default 则为 button_icon_pressed，否则为 button_icon_default 好的，接下来为它添加一个快捷键（热键）

1. 点击“Shortcut”（位于“Base Button”中，详见上文） 2. 新建快捷方式（New Shortcut） 3. 选择“Array[InputEvent]” 4. 添加元素 5. 在空白处选择“NewInputEventKey” 6. 进入配置界面，输入所需按键或组合键（我这里设置的是空格） 7. 至此，快捷键创建完成 InputEventKey 还有很多设置，我们来逐一说明： 1. **Pressed** – 按下时切换 True/False 状态 2. **Echo** – 用于控制按键长按效果 3. **Command...** – 在 Windows 系统中对应按住 Ctrl 键，在 Mac 系统中对应按住 Cmd 键 4.Alt Pressed – 按住Alt键（我觉得接下来的都懂了……） 5. Shift Pressed – 按住Shift键 6. Ctrl Pressed – 按住Ctrl键 7.Meta Pressed 指的是在 Windows 系统下按住 Win 键，或在 Mac 系统下按住 cmd 键（**请勿在您的游戏中使用与此相关的组合键——它在我的 Windows 10 系统上无法正常工作**）。其他内容对您可能没有太大帮助。 练习 2 – 更详细的按钮自定义（我将其命名为 ButtonPro）。 **该脚本优化不佳，请不要使用，我之后会重新编写。** 如果您觉得上一个版本在自定义方面不太满意，这里有一个更专业的自定义模板供您使用。按钮：

Вот полный скрипт с комментариями

复制代码：extends Button # 将我们的精灵加载到变量中 @export var button_icon_default: Texture2D # 标准图标 @export var button_icon_pressed: Texture2D # 已按下按钮 @export var button_icon_hovered: Texture2D # 鼠标悬停按钮 @export var button_icon_disabled: Texture2D # 已禁用按钮 @export var button_icon_hovered_and_pressed: Texture2D # 鼠标悬停并按下（仅在切换模式下） # 按钮按下时执行的操作 func _pressed(): # 每次按下按钮时文本会改变（在检查器中 Text 被标记为）button) text = "батон" if text == "button" else "button" # 按钮状态每次改变时图标都会变化（在检查器中，图标标记为“хлебный_треугольник”）。png) func _process(_delta): match get_draw_mode(): # 输出按钮状态（0到4） 0: icon = button_icon_default; flat = 0 # 标准图标 1: icon = button_icon_pressed; flat = 0 # 已按下按钮 2: icon = button_icon_hovered # 鼠标悬停按钮 3: icon = button_icon_disabled; flat = 1 # 已禁用按钮 4: icon = button_icon_hovered_and_pressed # 悬停并按下（仅在切换模式下） 编写脚本后，记得在检查器中指定自己的精灵！

在Godot中，可以创建单选按钮（RadioButton），这是一种通过按钮组（Button Group）与其他一个或多个单选按钮组合在一起的按钮。

我们来了解它的属性、方法和信号。 按钮组（Button Group）的属性： 1. allow_unpress() – 允许取消选中活动按钮。 按钮组（Button Group）的信号： 1. pressed(button: BaseButton): – 当其中一个单选按钮被按下时触发。 按钮组（Button Group）的方法： 1. get_buttons() – 返回属于当前按钮组的所有按钮列表。 2. get_pressed_button() – 返回当前处于活动状态的按钮。 实践 3 – 创建单选按钮组（Button Group + Button） 在这里，我们将了解并创建一个简单的按钮组。

创建单选按钮组 在场景中添加多个您想要的按钮（所有继承自 BaseButton 的按钮均支持按钮组功能）。 将它们全部通过一个 ButtonGroup 连接起来，并且需要为所有按钮勾选 toggle_mode（如果在将按钮添加到按钮组时切换模式处于禁用状态，Godot 会明确提示这一点）。 之后添加一个用于显示信息的 Label，并为其附加脚本。 在脚本中我们编写：

详细说明脚本： 1. @export var button_group: ButtonGroup # 这里很简单，只需在检查器中指定之前步骤中绑定单选按钮的按钮组 2. func _ready(): # 连接信号（括号内为任意信号名称） button_group.pressed.connect("信号名称") 3. func "信号名称"(pressed: BaseButton): # 括号内必须填写(var: BaseButton) # pressed.name — 场景中按钮节点的名称，pressed.text — 按钮的文本 text = pressed.name + " n" + pressed.text # n —换行符 最终代码如下：extends Label #必须在检查器中指定的按钮组 @export var button_group: ButtonGroup func _ready(): #连接信号（括号内为任意信号名称） button_group.pressed.connect(_update_text) #此信号函数将在按下组中任意按钮时触发 func _update_text(pressed: BaseButton): #pressed.name —场景中按钮节点的名称，pressed.text —按钮的文本 text = pressed.name + " n" + pressed.复选框按钮（CheckBox） 这是一个方形按钮，可在其中打勾，默认启用切换模式（toggle mode），非常适合创建单选按钮。与普通按钮的主要区别仅在于外观，以及主题覆盖（Theme Override）中内置的可更改状态图标（为何普通按钮不能这样设计，这仍是一个有待解答的问题）。 下面我们来了解复选框的这些状态：

1. checked – 按钮激活 2. checked_disabled – 按钮激活且已禁用 3. unchecked – 按钮未激活 4. unchecked_disabled – 按钮未激活且已禁用 5. radio_unchecked – 单选按钮未激活 6. radio_unchecked_disabled – 单选按钮未激活且已禁用 7. radio_checked – 单选按钮激活 8.radio_checked_disabled – 单选按钮处于激活且已禁用状态 实践4 — 按钮点击时的详细变化（ButtonGroup + CheckBox） 正如我之前所说，CheckBox非常适合用于创建单选按钮，因为它在“Control/Theme Override/Icons”（上文已讨论）中提供了内置的便捷选项，可用于自定义按钮状态。在这里，我将把ButtonGroup（按钮组）和CheckBox（复选框）结合起来，并为您编写一个模板脚本，该脚本使用起来会很方便，而且还会包含一个带有调试信息的函数。 效果如下：

在脚本中创建具有便捷设置的单选按钮组

1. 创建多个复选框（CheckBox）和纹理矩形（TextureRect）（我使用垂直容器（VBoxContainer）以便在场景中垂直分组按钮）。 2. 将按钮连接到按钮组（Button Group）。 3. 将脚本附加到纹理矩形（TextureRect）。 在脚本中编写：

在检查器中不要忘记指定纹理和按钮组

extends TextureRect # 纹理数组：[0] - 弓，[1] - 盾，[2] - 剑。需在检查器中指定 @export var textures: Array[Texture2D] # 按钮组，同样需在检查器中指定 @export var button_group = ButtonGroup func _ready(): consol(button_group) # 连接信号（括号内为任意信号名称） button_group.pressed.connect(_on_weapon_selected) func _on_weapon_selected(button: BaseButton): consol(button_group) # 点击按钮组中任意按钮时的调试输出 match button.名称： # 按钮名称 "RadioButtonBow"： # 点击此按钮时的效果 texture = textures[0] # 设置弓的纹理 "RadioButtonShield"： texture = textures[1] # 设置盾牌的纹理 "RadioButtonSword"： texture = textures[2] # 设置剑的纹理 # 在控制台显示调试信息的函数 func consol(group: ButtonGroup): print(" ") print("1. 属性 allow_unpress") print(group.is_allow_unpress()) print("2. 方法 get_buttons() 获取所有按钮列表") print(group.get_buttons()) print("3. ")метод pressed_button() какая кнопка активна") print(group.get_pressed_button()) Для использования кода просто укажите свои текстуры в инспекторе, названия кнопок в match button.name "имя CheckBox" или другой кнопки texture = textures[0] что будет происходить с текстурой Максимально емкая версия этого кода:extends TextureRect # Массив текстур: [0] - лук, [1] - щит, [2] - меч.нужно назначить в инспекторе @export var textures: Array[Texture2D] # 需要在检查器中指定的按钮组 @export var button_group = ButtonGroup func _ready(): # 连接信号（括号内为任意信号名称） button_group.pressed.connect(_on_weapon_selected) func _on_weapon_selected(button: BaseButton): match button.名称： # 按钮名称 "RadioButtonBow"：texture = textures[0] # 设置弓箭纹理 "RadioButtonShield"：texture = textures[1] # 设置盾牌纹理 "RadioButtonSword"：texture = textures[2] # 设置剑纹理 开启/关闭或切换开关（CheckButton） 本质上是普通的复选框（CheckBox），但图标（Icons）中的特性已修改，现在我将再次列出这些图标，因为存在标为“mirrored”（镜像）的特殊图标。

1. checked – 按钮激活 2. checked_disabled – 按钮激活且已禁用 3. unchecked – 按钮未激活 4. unchecked_disabled – 按钮未激活且已禁用 5. checked_mirrored – 按钮激活（镜像） 6. checked_disabled_mirrored – 按钮激活且已禁用（镜像） 7. unchecked_mirrored – 按钮未激活（镜像） 8. unchecked_disabled_mirrored – 按钮未激活且已禁用（镜像） 如何镜像按钮？操作很简单，只需在“布局方向”（Layout Direction）选项中选择“从右到左”（Right-to-Left），之后按钮就会翻转，并且在“图标”（Icons）中会使用带有“mirrored”标记的图标。

调色板，颜色选择器（ColorPicker） 这并非按钮，但要理解 ColorPickerButton 就离不开它，因为 ColorPickerButton 的核心正是 ColorPicker。无论是对用户还是开发者而言，ColorPicker 都是一个非常便捷的组件，通过检查器可以轻松对其进行配置（这一点与 ColorPickerButton 不同）。好了，我们开始了解它的属性、信号和方法。 ColorPicker 的属性：

1. **颜色** – 当前选中的颜色。 2. **编辑透明度（Edit Alpha）** – 显示透明度通道滑块。 3. **颜色模式（Color Mode）** – 当前颜色模式。 - **RGB** – 允许通过红/绿/蓝滑块编辑颜色。 - **HSV** – 允许通过色调/饱和度/亮度滑块编辑颜色。 - **RAW** – 扩展模式，允许处理超出标准范围 [0, 1] 的颜色，这对HDR效果和复杂操作很有用。OKHSL 是一种新的色彩空间，类似于 HSL，但更符合人类的视觉感知。 4. **延迟模式（Deferred Mode）**：若关闭此模式，每当颜色发生变化时，color_changed 信号就会触发（但在屏幕上使用取色器时，颜色虽有变化，信号不会触发）。若开启此模式，color_changed 信号仅在释放鼠标时触发。 5. **取色器形状（Picker Shape）**：色彩空间的显示形状。 HSV 矩形（HSV Ractangle）—— 带色条的矩形 HSV。HSV矩形色轮 – 带色环的矩形HSV。 VHS圆形色轮 – 带色条的圆形HSV。 OKHSL圆形色轮 – 改进版HSL，更符合视觉感知。 无 – 完全隐藏。 6. 可添加色板 – 允许从调色板保存颜色样本。 7. 取样器可见 – 颜色预览和取色器，若取色器形状不为“无”，则可选择颜色空间（调色板）的形状。 8.8. 颜色模式可见 – 显示颜色模式选择按钮，此外“彩色滑块”按钮可将滑块外观切换为灰色或彩色。 9. 滑块可见 – 显示颜色滑块。 10. 十六进制可见 – 显示十六进制颜色代码输入框。（也可在此处输入英文颜色名称，完整颜色列表可在“颜色”中查看）。 11. 预设可见 – 显示包含示例颜色和最近使用颜色的选项卡（左键选择颜色，右键删除颜色）。BoxContainer 的另一项属性： 12. Alignment – 颜色选择器（ColorPicker）元素的对齐方式 - Begin – 顶部对齐 - Center – 居中对齐 - End – 底部对齐 颜色选择器（ColorPicker）的信号：

1. color_changed() – 当颜色被选中时调用（即使只是用鼠标左键在调色板上滑动）。 2. preset_added() – 当新颜色添加到颜色样本（Swatches）时调用。 3. preset_removed() – 当颜色从样本中删除时调用。 ColorPicker 的方法（函数）：

1. add_preset(color: Color) – 将指定颜色添加到颜色样本（Swatches）中。 2. add_recent_preset(color: Color) – 将指定颜色添加到最近使用颜色（Recents Colors）中。 3. erase_preset(color: Color) – 从颜色样本（Swatches）中移除指定颜色。 4. erase_recent_preset(color: Color) – 从最近使用颜色（Recents Colors）中移除指定颜色。 5. get_presets() – 获取颜色样本（Swatches）中的所有颜色列表。 6. get_recent_presets() – 获取最近使用颜色（Recents Colors）中的所有颜色列表。带下拉调色板的按钮（ColorPickerButton） 总的来说，这是一个对用户而言非常方便的颜色选择调色板，但从开发者的角度来看，这个节点简直是个麻烦，不编写代码的话根本没法正常编辑。先说一下，这个节点由 Button、BaseButton、ColorPicker 和 PopupPanel 组成，所以最好也了解一下这些内容。简单介绍一下ColorPickerButton的工作原理：实际上，这是一个按钮，点击后会动态创建一个包含ColorPicker的弹出面板（PopupPanel）。但由于该面板是动态创建的，所以在检查器中没有ColorPicker的便捷属性。popup_menu 的属性和方法，以及其用途 对我来说，这一切既简单又复杂。选项按钮（Option Button）和菜单按钮（Menu Button）会动态创建弹出菜单（popup menu），要对其进行设置，就需要通过 get_popup() 方法来使用弹出菜单自身的属性和方法。总之，现在我将详细列出它的所有属性和方法。（一切都联系得如此紧密，以至于我甚至不知道哪些是真正需要的，哪些是可以剔除的） 带有操作列表的按钮菜单 PopupMenu（MenuButton） 打开弹出菜单（PopupMenu）的按钮，是的，为了正常工作，又得去深入研究这个按钮动态创建的节点。不过首先我们来分析一下 Menu Button 的属性、信号和方法。

1. 悬停切换（Switch on hover）—— 如果在两个按钮上启用此功能，当鼠标悬停到同一节点内另一个同样启用了“悬停切换”的菜单按钮（MenuButton）时，它将关闭当前菜单并打开另一个。无需点击，非常棒的功能，建议大家都去试试。 2. 物品数量（Item Count）—— 按钮内的元素数量。 接下来是各个单独元素的属性。 3. 文本（Text）—— 文字内容。 4. 图标（Icon）—— 图标或图片。 5. 可勾选（Checkable）—— 按钮旁的标记： - 无（No）—— 不存在。复选框（Checkbox）为方形。 单选按钮（Radio Button）为圆形。 6. 已勾选（Checked）——按钮的标记在视觉上呈现为被按下状态。 7. 已禁用（Disabled）——按钮被关闭/锁定。 8. 分隔符（Separator）——锁定按钮并将其变为视觉分隔符。 信号

1. 在菜单出现前按下时触发。 方法

1. get_popup() – 返回弹出菜单（PopupMenu），这是用于设置该按钮及内部逻辑的必要函数。 2. set_disable_shortcuts(disabled: bool) – 若启用此功能，则会禁用该按钮的快捷键（shortcuts）。 3. show_popup() – 立即调整菜单按钮（MenuButton）的窗口位置和大小，然后打开弹出窗口（PopupMenu）。请使用此函数替代 get_popup().popup()，后者只会在左上角打开弹出窗口。对于从未打开过文档或在文档中没太弄明白的新手来说，会立刻产生一个问题：该如何使用它？答案很简单：借助 get_popup() 以及 Popup Menu 的属性、方法和信号。 这里还有一些关于弹出菜单（popup menu）的理论知识（真要命，又得去研究它的十几个属性……），不过我们只需要了解弹出菜单的关键部分，也就是它的信号，具体如下： 弹出菜单（Popup Menu）的信号 1.1. id_focused(id: int)——通过键盘选择菜单项时触发，参数传递所选菜单项的id。 2. id_pressed(id: int)——点击弹出菜单（popup menu）项时触发，参数传递其id。 3. index_pressed(index: int)——点击弹出菜单（popup menu）项时触发，参数传递其索引（index）。 4.menu_changed()——在添加、删除和修改弹出菜单（popup menu）元素时触发（该函数并非对所有修改都触发，例如对set_item_as_separator不触发。确认会触发的情况包括set_item_text、set_item_disabled、remove_item）。 实践5——弹出菜单（Popup Menu）的简单使用与修改 在本部分中，我将结合以下示例，展示并讲解如何使用菜单按钮（menuButton），更准确地说是其中内置的弹出菜单（PopupMenu）：

带选项的按钮菜单（OptionButton） 链接到你喜爱视频的按钮 :З（LinkButton） 带有你喜爱图片的按钮（TextureButton） 游戏控制按钮（TouchScreenButton）