Qt常用的按钮控件编程（三）-- QRadioButton 按钮

---

前言

本文介绍QT常用控件的第三个按钮，QRadioButton 单选按钮编程。通过这个例子，初步了解QT管理资源机制，以及如何分组管理QRadioButton 单选按钮。项目演示如何使用默认的分组和 QButtonGroup 进行互斥设置，保证多个选项所在的组内只有一个被选中。项目使用样式表文件将两组按钮使用不同的样式表进行外观设置。
文章中使用的例程和内容都是在chatgpt的帮助下完成的，例程经过测试通过。
我们的调试环境仍然是双架构Kits，编译调试在当前的ubuntu（qt5）中进行，重新编译后下载到目标arm设备（qt4）中运行。
我们的编程环境为：Ubuntu64位系统（22.04），目标架构：（1）qt5 x86_64 架构，（2）qt4 32位arm架构。
环境配置请参见《Qt常用的按钮控件编程（一）》第1节。

感谢朋友提供的chatgpt软件，特别是其中的gpt-box桌面工具，更是我离不开的工具。感兴趣的同仁可前往一观（apsuai.com）。

5、QRadioButton 按钮

QRadioButton 是 Qt 中的一个控件类，表示一个单选按钮。在一组单选按钮中，只有一个可以被选中。通常配合 QButtonGroup 使用来实现分组单选功能。

5.1 例程功能和程序执行效果

5.1.1 例程功能

该例程利用 QRadioButton 控件实现了多选项的单选，让用户方便地进行选择。通过默认的分组和 QButtonGroup 进行互斥设置，保证多个选项所在的组内只有一个被选中，从而达到符合用户交互习惯的效果。例程中涉及到了 单选按钮（QRadioButton） 和 按钮组（QButtonGroup ）控件的使用。
在该例程中，5 个 单选控件分为 2 组，分别为第一组的 2 个单选控件和第二组的 3 个 单选控件。我们的程序将 5 个控件添加到主窗口中。
对于第一组的 2 个 单选控件，使用 Qt 默认的分组功能，即将这两个控件放在主窗口中，因为 QRadioButton 是继承自 QAbstractButton 的，所以它的自动互斥特性会自动生效，即任何一组中多个 QRadioButton 控件只能有一个被选中。
对于第二组的 3 个 单选控件，使用 按钮组（QButtonGroup ）来实现互斥。这里我们新建一个 QButtonGroup 控件，将其加入到主窗口中，然后将窗口中的 3 个单选控件分别添加到该 QButtonGroup 中。这样，当选中其中某个单选控件时，其他组内的单选控件会自动取消选择。可以通过 setChecked() 函数设置初始选中状态，程序启动后，用户可以通过鼠标或触摸选择其他单选控件。

5.1.2 程序执行效果

其中开关一和开关二为第一组，选择一、选择二、选择三第二组。

5.2 生成项目

打开 Qt Creator 并创建一个新的 应用程序项目_radiobutton,选择了Widget基类，不要勾选“Generate form”,将两个配置好的Kits同时选上,项目新建完成如下图。(详细的项目新建过程参见：《Qt常用的按钮控件编程（一）》）

5.3 添加资源文件

在 Qt 中，可以使用资源文件（.qrc 文件）将一些静态资源（如图像、音频等）打包到应用程序中，以方便统一管理和部署。在本例程中，在images 文件夹中准备了4张图片，拷贝到本项目路径中，下图演示了如何将资源添加到项目中。

5.3.1 添加图片资源

• 在项目目录中右键点击 Resources 目录，选择 Add New… ，并选择 Qt -> Qt Resource File。
  
  在打开的对话框中输入名称（最好与文件名一致），然后点击 Next。

输入资源文件的名称(自行定义)和位置，然后点击“下一步”。

在 Qt Creator 中新建资源文件后，默认会进入 res.qrc 文件编辑模式（如果关闭了，可以右键这个文
件点击选择“Open in Editor”），为了方便分类管理文件，我们可以使用 Add Prefix 功能为资源文件添加前缀，前缀的格式应该为类似文件系统中的路径格式，例如 /images。
为了确保路径正确，前缀中的 / 是必需的，它在资源文件引用时是路径分隔符，起到类似 Linux 下根节点的作用，我们现在第⑪处添加了前缀/。

添加了前缀后，我们添加资源图片，放在/images 前缀的下面。这里我们导入在本项目路径 images 文件夹中的4张图片，添加完成需要按“Ctrl + S”保存 res.qrc 才会看到左边的结果。添加完成如下图。

5.3.2 添加 qss 文件

QSS 文件是使用 Qt 程序相关联的样式表文件。它由 GUI 元素的外观和感觉，包括布局，颜色，鼠标的行为，大小和字体。它的风格，一个可以合并到一个 UI（用户界面）。与 HTML 的 CSS 类似，Qt 的样式表是纯文本的格式定义，在应用程序运行时可以载入和解析这些样式定义，从而使应用程序的界面呈现不同的效果。
如上图加入一个空白文件，新建的文件名 style.qss 文件，如下图，默认添加到项目的路径下，后面步骤采用默认，直至完成。
编辑style.qss，保存，最后完成的项目如下图所示：

style.qss文件内容：

/* 第一组 QRadioButton 设置 */
QRadioButton#radiogroup1{
   
    spacing: 2px;
    color: red;
}
QRadioButton#radiogroup1::indicator {
   
    width: 45px;
    height: 30px;
}
QRadioButton#radiogroup1::indicator:unchecked {
   
    image: url(:/images/switch_off.png);
}
QRadioButton#radiogroup1::indicator:checked {
   
    image: url(:/images/switch_on.png);
}

/* 第二组 QRadiobutton 设置 */
QRadioButton#radiogroup2 {
   
    spacing: 2px;
    color: blue;
}
QRadioButton#radiogroup2::indicator {
   
    width: 45px;
    height: 30px;
}
QRadioButton#radiogroup2::indicator:unchecked {
   
    image: url(:/images/radiobutton-off.png);
}
QRadioButton#radiogroup2::indicator:checked {
   
    image: url(:/images/radiobutton-on.png);
}

5.4 完成代码编辑

5.4.1 修改项目文件 _radiobutton.pro

1 	QT       += core gui
2 
3 	greaterThan(QT_MAJOR_VERSION, 4): QT += widgets
4 
5 	CONFIG += c++11
6