Qt之QDial选择器

@TOC

---

前言

Qt是一种流行的跨平台的C++ GUI应用程序开发框架，用于构建图形用户界面(GUI)和其他桌面应用程序。QDial是Qt框架中的一个小部件，用于创建旋转式的拨号器。本文将介绍如何使用QDial进行基本的GUI应用程序开发，包括QDial的主要特性和方法，以及如何将其添加到应用程序的用户界面中。

---

一、QDial是什么

QDial很像大家在射击手游中的移动键。如下图所示：

接下来，我将带大家来学习QDial

二、操作api

• 构造函数：

QDial(QWidget *parent = nullptr)：构造一个 QDial 对象，并指定其父级窗口。

• 值设置和获取：

void setValue(int value)：设置 QDial 的当前值。
int value() const：获取 QDial 的当前值。

• 范围设置和获取：

void setRange(int minValue, int maxValue)：设置 QDial 的取值范围。
int minimum() const：获取 QDial 的最小值。
int maximum() const：获取 QDial 的最大值。

• 步长设置和获取：

void setSingleStep(int step)：设置 QDial 的步长。
int singleStep() const：获取 QDial 的步长。

• 外观设置和获取：

void setNotchesVisible(bool visible)：设置是否显示 QDial 上的刻度线。
bool notchesVisible() const：检查是否显示 QDial 上的刻度线。

• 返回 QDial 上刻度线的大小， 刻度线的大小指的是刻度线的长度。

int notchSize() const

• 返回 QDial 上刻度线的目标位置。 刻度线的目标位置是一个介于 0.0 和 1.0 之间的小数值，表示刻度线在 QDial 上的相对位置。

qreal notchTarget() const

• 设置 QDial 上刻度线的目标位置。 target 参数是一个介于 0.0 和 1.0 之间的小数值，表示刻度线在 QDial 上的相对位置。

void setNotchTarget(double target)

• 返回一个布尔值，指示 QDial 是否启用环绕模式。 如果环绕模式启用，旋转旋钮会在最小值和最大值之间循环；如果禁用，旋钮会在达到最小值或最大值时停止旋转。

bool wrapping() const

信号与槽

由于QDial继承于QAbstractSlider，所以QDial的信号与槽是和QAbstractSlider是一样的！

• 当范围值改变时

void rangeChanged(int min, int max)

• 当滑动时

void sliderMoved(int value)

• 当滑块被按下时

void sliderPressed()

• 当滑块释放时

void sliderReleased()

• 当值变化时

void valueChanged(int value)

示例代码

因为其很简单，所以我并未创建Widget类，直接使用QWidget

#include <QApplication>
#include <QDial>
#include <QVBoxLayout>
#include <QDebug>
#include <QWidgt>

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    // 创建主窗口及布局
    Widget window;
    QVBoxLayout layout(&window);

    // 创建 QDial
    QDial dial;
    
    // 设置 QDial 的取值范围和步长
    dial.setRange(0, 100);
    dial.setSingleStep(1);
    
    // 设置刻度线可见
    dial.setNotchesVisible(true);
    
    // 设置刻度线的目标位置
    dial.setNotchTarget(0.2);
    
    // 设置环绕模式启用
    dial.setWrapping(true);
    
    // 连接 QDial 的 valueChanged 信号到输出当前值
    QObject::connect(&dial, &QDial::valueChanged, [](int value){
        qDebug() << "Value:" << value;
    });

    // 将 QDial 添加到布局中
    layout.addWidget(&dial);

    // 显示窗口
    window.show();

    return app.exec();
}

上述示例代码创建了一个简单的窗口应用程序，其中包含一个 QDial 控件。在该示例中，我们将 QDial 的取值范围设置为 0 到 100，并将步长设置为 1。我们还通过设置 setNotchesVisible(true) 使刻度线可见，并使用 setNotchTarget(0.2) 设置刻度线的目标位置为 0.2。然后，我们使用 setWrapping(true) 启用了环绕模式。最后，我们通过连接 valueChanged 信号来输出 QDial 的当前值。

您可以根据需要在此示例代码的基础上进行修改和扩展，以适应您的实际需求。

总结

最后，要记住Qt提供了许多其他用于交互和用户界面设计的工具和组件。通过结合使用不同的Qt元素，您可以创建出富有创意和独特的用户界面，满足各种应用程序的需求。