【Godot4.2】按钮控件全解析

2024-02-26 19:44
文章标签 解析 控件 按钮 godot4.2

本文主要是介绍【Godot4.2】按钮控件全解析,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

概述

Godot虽然有内置文档和在线文档,但是对于特定控件的讲解资料是很少的。因此对于使用者可能会造成一定困扰。笔者(Bilibili@巽星石)一直想实现一个Godot控件的详细教程,为了实现这个目的,我会开始一系列的文章来进行总结,并不断地修改,以便于读者食用。

Button

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

image.png

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

image.png

设定按钮文本

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

# 改变按钮文本
button.text = "普通按钮"

设定文本的对齐方式

通过alignment属性可以设定按钮文本在按钮矩形区域中的对齐方式。

image.pngimage.png

设定文本超出按钮矩形区域的行为

因为text属性没有限定文本的长度,所以一定会存在按钮和文本长度不一致时的行为问题。
text_overrun_behaviorclip_text,都用于设定文本超出按钮矩形区域后是否裁剪文本。
在中文文本下,text_overrun_behavior除了默认的不裁剪外的其他几个选项似乎没有多大的区别,甚至你可以直接忽略这个属性直接启用clip_text。效果是类似的。
image.pngimage.pngimage.png

为按钮设定图标

通过icon属性我们可以为按钮设定图标。默认图标在左,文本在右。
image.png

设定图标与按钮的不同位置组合

通过icon_alignmentvertical_icon_alignment两个属性,结合设定文本对齐的alignment属性,可以组合出多种图标和按钮的位置关系。
image.png

image.png
默认,图标在左,文本在右。
image.pngimage.png图标在上,文本在下。
image.pngimage.png文本在右,图标在左。
image.pngimage.png文本在上,图标在下。

让图标跟随按钮缩放

expand_icon设定图标是否跟随按钮的大小变化进行动态缩放。但在一般情况下这会使得图标变得不清晰。
image.png

BaseButton

Godot的普通按钮Button,继承自基类BaseButton,它提供了所有按钮类型共用的一些基础属性和方法。
image.png

禁用按钮

disabled属性规定了按钮是否处于禁用状态,禁用状态下按钮及其文本变为灰色,并且无法响应鼠标点击。
image.png

切换按下与松开状态

toggle_mode则决定按钮是否在按下与未按下的状态间进行切换,默认为false。也就是默认情况下按钮被点击后先是被按下,然后松开后回弹,并不会一直处于按下状态。toggle_mode则改变了这一行为,按下的按钮将不会回弹,再次点击才会回弹,类似于一种开关的状态切换。
button_pressed则是返回toggle_mode=true状态下,按钮是否被按下。

设定按钮可以响应的鼠标按键

action_mode是设定按钮被确定为按下时的时机,一个是按下就触发,一个是释放时才触发。
image.png
button_mask,设定按钮可以响应鼠标的左键、中间还是右键点击。默认情况下按钮只接受左键点击。
image.png

# 设定按钮能同时响应鼠标左键和右键的点击
button.button_mask = MOUSE_BUTTON_MASK_LEFT | MOUSE_BUTTON_MASK_RIGHT

移出后的细节

keep_pressed_outside=true,则按钮被按下后,鼠标移出按钮区域外时仍然保持按钮被按下的状态。

创建按钮组

button_group,通过创建一个ButtonGroup资源,将多个按钮联系在一起,形成一个按钮组,同一时间只有一个按钮能被按下。
我们创建多个Button,然后启用toggle_mode,并为它们同一创建ButtonGroup。或者为其中一个按钮创建ButtonGroup后,右键“复制值”,或者Ctrl+C,然后转到其他节点的button_group信号处,右键“粘贴值”(或Ctrl+V)。
image.png
image.pngimage.png
这时候运行,就会发现三个按钮只有一个按钮能被按下,类似于在多个可选项中进行单选。
image.png

设定按钮快捷键

通过为shortcut属性创建Shortcut资源可以为按钮设定快捷键。甚至你可以为同一个按钮设置多个快捷键,或者为不同的设备设定此按钮的快捷键。

在这里插入图片描述

Godot4.2也贴心的为我们进行按键监听,我们只需要点击“配置按钮”,在打开的类似于“输入映射”配置的窗口中输入键盘快捷键。
image.png
关闭后,会自动帮我们填写到其属性中。
image.png
shortcut_feedback决定在按快捷键时,按钮是否显示被按下的时的高亮,默认为true。如果是false,而且toggle_mode=false时,则按快捷键时,按钮本身不会有任何视觉反馈。
shortcut_in_tooltip决定是否在鼠标提示文本中添加快捷键信息,默认为true。将鼠标移动到按钮上可以看到用括号括起来的快捷键信息。
image.png
我们为按钮添加一段鼠标提示文本。再次运行可以看到带有鼠标提示文本和快捷键提示的效果。
image.pngimage.png

Control

image.png

按钮的状态

状态说明
normal默认(鼠标未移入)
hover鼠标移入
pressed按下
disabled禁用
focus获得焦点

相应的我们可以在主题覆盖部分,设定按钮在五种状态下的“样式盒”、文本以及图标的颜色。
image.png

设定按钮字体和字号

同样是在样式覆盖部分,可以设定按钮的字体和字号。
image.png

为按钮文本添加描边

在样式覆盖的常量部分,可以通过outline_size设定按钮文本的描边宽度,颜色部分的font_outline_color则可以设定描边的颜色。
image.pngimage.png
image.png

限制按钮图标的最大宽度

image.png

设定按钮的焦点和邻居

图形用户界面的控件之间存在一种“焦点”的东西,在同一个窗口中,通常同一时间只能有一个控件获得焦点。而且可以人为的设定焦点顺序,以及控件的毗邻关系。从而可以通过键盘的Tab/Shift+Tab键快速向前或向后切换焦点。以及用键盘或手柄的方向键上下左右切换到指定的毗邻节点。
image.png

限定按钮快捷键为局部快捷键

上面通过shortcut属性设定的快捷键默认是全局的,但有些情况下可能需要在某个局部GUI获得焦点时,在局部使用这些快捷键,这时可以设定shortcut_context,来限定快捷键为局部快捷键。
image.png

特殊按钮类型

Button派生的有4个按钮子类型。
image.png

CheckButton

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

自定义CheckButton的图标

通过主题覆盖部分,图标分组下,可以设定自定义的选中和非选中状态下的图标。比如这里我们使用的对钩图标。
image.pngimage.png

MenuButton

MenuButton是一种特殊按钮,点击后会弹出一个下拉菜单。通过其items属性,我们可以设定菜单项。
image.pngimage.pngimage.png
也可以为每个菜单项设定图标,以及是否可以勾选并显示复选框或单选框。
image.png
通过添加separator属性为true的菜单项,可以添加菜单项之间的分割线,用于菜单项的人为分组。
image.pngimage.png

OptionButton

OptionButton也是一个带下拉框的按钮,其样式更像传统的“组合框”(ComboBox)。
同样通过其items属性添加下拉选项,也可以设定分割线,为项添加图标等。
image.pngimage.png

LinkButton

LinkButton模拟超链接的效果,通过设定有效网站链接或本地文件系统路径,点击时将通过系统默认浏览器打开网站或者资源管理器打开文件夹或默认程序打开文件。
image.pngimage.png

TextureButton

TextureButton是最特殊的一种按钮,它允许你通过设定按钮几种状态下的图片来创建图片按钮。或者至少你需要设定一张图片来作为按钮的外形。
image.png

这篇关于【Godot4.2】按钮控件全解析的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/749937

相关文章

Mybatis Plus JSqlParser解析sql语句及JSqlParser安装步骤

《MybatisPlusJSqlParser解析sql语句及JSqlParser安装步骤》JSqlParser是一个用于解析SQL语句的Java库,它可以将SQL语句解析为一个Java对象树,允许... 目录【一】jsqlParser 是什么【二】JSqlParser 的安装步骤【三】使用场景【1】sql语

SpringBoot整合Sa-Token实现RBAC权限模型的过程解析

《SpringBoot整合Sa-Token实现RBAC权限模型的过程解析》:本文主要介绍SpringBoot整合Sa-Token实现RBAC权限模型的过程解析,本文给大家介绍的非常详细,对大家的学... 目录前言一、基础概念1.1 RBAC模型核心概念1.2 Sa-Token核心功能1.3 环境准备二、表结

Java 关键字transient与注解@Transient的区别用途解析

《Java关键字transient与注解@Transient的区别用途解析》在Java中,transient是一个关键字,用于声明一个字段不会被序列化,这篇文章给大家介绍了Java关键字transi... 在Java中,transient 是一个关键字,用于声明一个字段不会被序列化。当一个对象被序列化时,被

Java JSQLParser解析SQL的使用指南

《JavaJSQLParser解析SQL的使用指南》JSQLParser是一个Java语言的SQL语句解析工具,可以将SQL语句解析成为Java类的层次结构,还支持改写SQL,下面我们就来看看它的具... 目录一、引言二、jsQLParser常见类2.1 Class Diagram2.2 Statement

python进行while遍历的常见错误解析

《python进行while遍历的常见错误解析》在Python中选择合适的遍历方式需要综合考虑可读性、性能和具体需求,本文就来和大家讲解一下python中while遍历常见错误以及所有遍历方法的优缺点... 目录一、超出数组范围问题分析错误复现解决方法关键区别二、continue使用问题分析正确写法关键点三

使用Java实现Navicat密码的加密与解密的代码解析

《使用Java实现Navicat密码的加密与解密的代码解析》:本文主要介绍使用Java实现Navicat密码的加密与解密,通过本文,我们了解了如何利用Java语言实现对Navicat保存的数据库密... 目录一、背景介绍二、环境准备三、代码解析四、核心代码展示五、总结在日常开发过程中,我们有时需要处理各种软

WinForms中主要控件的详细使用教程

《WinForms中主要控件的详细使用教程》WinForms(WindowsForms)是Microsoft提供的用于构建Windows桌面应用程序的框架,它提供了丰富的控件集合,可以满足各种UI设计... 目录一、基础控件1. Button (按钮)2. Label (标签)3. TextBox (文本框

Python多进程、多线程、协程典型示例解析(最新推荐)

《Python多进程、多线程、协程典型示例解析(最新推荐)》:本文主要介绍Python多进程、多线程、协程典型示例解析(最新推荐),本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定... 目录一、multiprocessing(多进程)1. 模块简介2. 案例详解:并行计算平方和3. 实现逻

Spring Boot拦截器Interceptor与过滤器Filter深度解析(区别、实现与实战指南)

《SpringBoot拦截器Interceptor与过滤器Filter深度解析(区别、实现与实战指南)》:本文主要介绍SpringBoot拦截器Interceptor与过滤器Filter深度解析... 目录Spring Boot拦截器(Interceptor)与过滤器(Filter)深度解析:区别、实现与实

MyBatis分页插件PageHelper深度解析与实践指南

《MyBatis分页插件PageHelper深度解析与实践指南》在数据库操作中,分页查询是最常见的需求之一,传统的分页方式通常有两种内存分页和SQL分页,MyBatis作为优秀的ORM框架,本身并未提... 目录1. 为什么需要分页插件?2. PageHelper简介3. PageHelper集成与配置3.