首页 > 其他分享 >Qt教程 — 3.4 深入了解Qt 控件:Input Widgets部件(3)

Qt教程 — 3.4 深入了解Qt 控件:Input Widgets部件(3)

时间:2024-03-16 17:29:25浏览次数:28  
标签:控件 Qt int 滚动条 3.4 设置 滑动 MainWindow

目录

1 Input Widgets简介

2 如何使用Input Widgets部件

2.1 Dial 组件-模拟车速表

2.2 QScrollBar组件-创建水平和垂直滚动条

2.3 QSlider组件-创建水平和垂直滑动条 

2.4 QKeySequenceEdit组件-捕获键盘快捷键


Input Widgets部件部件较多,将分为三篇文章介绍

文章1(Qt教程 — 3.2 深入了解Qt 控件:Input Widgets部件(1)-CSDN博客):ComboBox (组合框)、FontComboBox (字体组合框)、LineEdit (单行编辑框)、TextEdit (文本编辑框)、PlainTextEdit (纯文本编辑框)

文章2(Qt教程 — 3.3 深入了解Qt 控件:Input Widgets部件(2)-CSDN博客):SpinBox (数字旋转框)、DoubleSpinBox (双精度数字旋转框)、TimeEdit (时间编辑框):、DateEdit (日期编辑框)、DateTimeEdit (日期时间编辑框): 

文章3(本文):Dial (数字拨盘框)、HorizontalScrollBar (水平滚动条)、VerticalScrollBar (垂直滚动条): 、HorizontalSlider (水平滑动条)、VerticalSlider (垂直滑动条)、KeySequenceEdit (按键序列编辑框)

1 Input Widgets简介

Qt的Input Widgets部件是一系列专门用于数据输入的界面元素。它们允许用户通过图形界面与应用程序进行交互,并提供不同的数据输入方式。以下是一些常见的Input Widgets部件:

  1. Dial (数字拨盘框): 提供了一个旋转拨盘控件,用于选择数值,常用于模拟选择器或调节器。

  2. HorizontalScrollBar (水平滚动条): QScrollBar 继承 QAbstractSlider,下同。一种水平滚动条,允许用户通过滑动来水平导航。

  3. VerticalScrollBar (垂直滚动条): 一种垂直滚动条,允许用户通过滑动来垂直导航。

  4. HorizontalSlider (水平滑动条): 水平方向的滑动条,允许用户通过拖动选择一个数值。

  5. VerticalSlider (垂直滑动条): 垂直方向的滑动条,允许用户通过拖动选择一个数值。

  6. KeySequenceEdit (按键序列编辑框): QKeySequenceEdit 继承 QWidget。允许用户输入和编辑键盘快捷键序列。

2 如何使用Input Widgets部件

2.1 Dial 组件-模拟车速表

QDial是Qt框架中的一个组件,用于提供一个圆形的拨盘控件,允许用户通过旋转拨盘来选择一个数值。它是 QAbstractSlider的一个子类,因此继承了滑动条(滑块)的许多特性,包括设置最小值、最大值、当前值以及步长等。QDial通常用于提供一个直观的方式来调整音量、选择颜色的饱和度、亮度等参数。

实现QDial的主要特征涉及设置其各种属性以及连接信号和槽,以便于与用户的交互。以下是如何实现QDial的一些关键特征:

  • 数值选择:使用setRange(int min, int max)方法设置最小和最大值。使用setValue(int value)设置初始值。
  • 自定义外观:可以通过样式表setStyleSheet来自定义QDial的外观,例如,改变拨盘的背景色、指针的颜色等。
  • 范围和间隔:setRange(int min, int max)用于设置拨盘的最小和最大数值范围。setSingleStep(int step)设置用户每次旋转时的最小变化值。 
  •  信号QDial继承自QAbstractSlider,因此提供了valueChanged(int)sliderPressed()sliderMoved(int)sliderReleased()等信号。
  •  可选的刻度显示: 使用setNotchesVisible(bool visible)来设置是否显示刻度。使用setNotchTarget(double target)可以设置刻度的间隔,这个值表示刻度间隔的理想像素宽度,实际间隔会尽量接近这个值。

使用一个 QDial,以一个 QLabel,模拟车速表。当程序初始化界面后,拖动滑块的位置, label 则会显示 dial 的值

(1)首先按照文章新建项目(Qt教程 — 1.3 如何创建Qt项目-CSDN博客)。

(2)在头文件“mainwindow.h”修改代码,具体代码如下。1)导入QComboBox文件 —> 2)声明一个 QComboBox 对象和对应槽函数。完整代码如下。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
// 引入 QComboBox
#include <QComboBox>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    // 声明一个 QComboBox 对象
    QComboBox *comboBox;

private slots:
    // 声明 QComboBox 对象的槽函数
    void comboBoxIndexChanged(int);

};
#endif // MAINWINDOW_H

(3)在文件“mainwindow.cpp”修改代码,具体代码如下。 1)设置主窗体的显示位置与大小。—> 2)实例化QDial和QLabel对象,设置QDial和QLabel显示位置与大小。设置dial页长、刻度等和label文字—>3)信号槽连接—>4)写出槽函数,模拟车速表。添加完整代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    // 设置主窗体的位置与大小
    this->setGeometry(0, 0, 800, 480);

    /****** 1 ******/
    // 实例化对象和设置显示位置与大小
    dial = new QDial(this);
    dial->setGeometry(100, 50, 150, 150);
    // 设置页长(两个最大刻度的间距)
    dial->setPageStep(10);
    // 设置刻度可见
    dial->setNotchesVisible(true);
    // 设置两个凹槽之间的目标像素数
    dial->setNotchTarget(1.00);
    // 设置 dial 值的范围
    dial->setRange(0,100);
    // 开启后可指向圆的任何角度
    //dial->setWrapping(true);
    // 实例化对象和设置显示位置与大小
    label = new QLabel(this);
    label->setGeometry(155, 100, 200, 50);
    // 初始化为 0km/h
    label->setText("0km/h");
    // 信号槽连接
    connect(dial, SIGNAL(valueChanged(int)),this, SLOT(dialValueChanged(int)));

}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::dialValueChanged(int val)
{
    // QString::number()转换成字符串
    label->setText(QString::number(val) + "km/h");
}

(4)程序编译运行的结果如下,当程序初始化时, QDial 控件的显示如下。当用鼠标拖动
滑块或者按键盘的上下左右方向键时, label 则会显示当前“车速”。

2.2 QScrollBar组件-创建水平和垂直滚动条

QScrollBar是Qt框架中的一个控件,它提供了标准的滚动条界面,允许用户通过拖动滚动块或点击箭头按钮来滚动内容区域。QScrollBarQAbstractSlider的子类,因此它继承了滑块控件的一般特性,如设置最小值、最大值、当前值以及滑块的步进值等。下是其主要功能设置:

  • 方向性:QScrollBar可以是水平的也可以是垂直的,这由构造函数中的Qt::Orientation参数决定。
  • 数值范围和步进:可以设置滚动条的最小值、最大值(通过setMinimumsetMaximum方法),当前值(通过setValue方法)以及页步进值和单步进值(分别通过setPageStepsetSingleStep方法设置)。页步进通常用于表示用户点击滚动条背景时应该滚动的距离,而单步进值则用于箭头按钮或滚动条的键盘导航。
  • 自定义外观:通过Qt的样式表(Style Sheets),开发者可以自定义滚动条的外观,包括滚动条的轨道、滑块、和箭头按钮的样式。
  • 信号QScrollBar发出valueChanged(int)信号来通知滚动条的当前值发生了变化。此外,它还可能发出rangeChanged(int min, int max)信号,以通知滚动条的数值范围发生变化。

创建水平和垂直滚动条,使用 QScrollBar 类实例化两个控件,一个是水平滚动条,另一个是垂直滚动条,中间用一个标签文本来显示。

(1)为了简便,直接在上节的项目中添加代码。以下代码为本节可单独运行的代码,实验结果为和前节结合的代码,后同。

(2)在头文件“mainwindow.h”修改代码,具体代码如下。1)导入<QScrollBar>文件 —> 2)声明QScrollBar、QLabel对象。完整代码如下。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QScrollBar>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;

    // 声明水平滚动条对象
    QScrollBar *horizontalScrollBar;
    // 声明垂直滚动条对象
    QScrollBar *verticalScrollBar;
    // 声明标签文本
    QLabel *label_1;
  
};
#endif // MAINWINDOW_H

(3)在文件“mainwindow.cpp”修改代码,具体代码如下。 1)设置主窗体的显示位置与大小。—> 2)实例化QhorizontalScrollBar、QverticalScrollBar、QLabel对象和显示位置与大小。添加完整代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    // 设置主窗体的位置与大小
    this->setGeometry(0, 0, 800, 480);

    /****** 2 ******/
    // 实例化水平滚动条及设置位置大小
    horizontalScrollBar = new QScrollBar(Qt::Horizontal, this);
    horizontalScrollBar->setGeometry(0, 450, 800, 30);
    // 实例化垂直滚动条及设置位置大小
    verticalScrollBar = new QScrollBar(Qt::Vertical, this);
    verticalScrollBar->setGeometry(770, 0, 30, 480);
    // 实例化,标签文本
    label = new QLabel(this);
    // 设置文本
    label->setText("测试滚动条");
    //设置位置大小
    label->setGeometry(600, 400, 100, 20);

}

MainWindow::~MainWindow()
{
    delete ui;
}

(4) 程序编译运行的结果。如下当程序初始化时,滚动条控件的显示如下。

2.3 QSlider组件-创建水平和垂直滑动条 

QSlider是Qt框架中的一个控件,它提供了一个滑动条,允许用户通过拖动滑块来选择一个数值范围内的值。这个控件非常适合于需要从一定范围内选择单个值的场景,例如调节音量、亮度或应用程序中的任何参数调整。下是其主要功能设置:

  • 方向性QSlider可以是水平的也可以是垂直的。这通过构造函数中的Qt::Orientation参数来设置,可以是Qt::HorizontalQt::Vertical
  • 数值范围:可以通过setMinimum(int)setMaximum(int)方法设置滑动条的最小值和最大值。这定义了用户可以选择的值的范围。
  • 当前值:当前值表示滑块的位置对应的数值,可以通过setValue(int)方法设置。value()方法用于获取当前值。
  • 刻度线QSlider支持刻度线的显示,刻度线可以放置在滑动条的上方、下方、左侧或右侧,或者同时在两边。这通过setTickPosition(QSlider::TickPosition)方法设置。可用的刻度位置包括NoTicks(无刻度)、TicksAboveTicksBelowTicksBothSidesTicksLeftTicksRight
  • 步进值setSingleStep(int)方法用于设置滑块移动的单步大小。还有setPageStep(int),当用户点击滑动条的空白区域时,滑块移动的大小。

创建水平和垂直滑动条,创建两个 QSlider 对象,一个是水平滑动条,另一个是垂直滑动条;用一个 Label 来显示当前水平或垂直滑动条当前的值。设置水平滑动条与水平滑动条相互关联,通过滑动其中一个滑动条的值相应的也会改变另一个滑动条的值。

(1)为了简便,直接在上节的项目中添加代码。

(2)在头文件“mainwindow.h”修改代码,具体代码如下。1)导入<QSlider>、<QLabel>文件 —> 2)声明水平滚动条和垂直滚动条QSlider对象、QLabel对象。 —> 3)声明QSlider槽函数。完整代码如下。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

#include <QLabel>
#include <QSlider>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    // 声明对象
    QSlider *horizontalSlider;
    QSlider *verticalSlider;
    QLabel *label_2;

private slots:
    // QSlider槽函数
    void horizontalSliderValueChanged(int);
    void verticalSliderValueChanged(int);
};
#endif // MAINWINDOW_H

(3)在文件“mainwindow.cpp”修改代码,具体代码如下。 1)设置主窗体的显示位置与大小。—> 2)实例化水平滚动条和垂直滚动条QSlider对象、QLabel对象和显示位置与大小。—>3)信号槽连接。—>4)写出槽函数,显示滑动条值。添加完整代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    // 设置主窗体的位置与大小
    this->setGeometry(0, 0, 800, 480);

    /****** 3 ******/
    // 实例化水平滑动条对象
    horizontalSlider = new QSlider(Qt::Horizontal, this);
    // 设置显示的位置与大小
    horizontalSlider->setGeometry(300, 150, 150, 20);
    // 设置值范围
    horizontalSlider->setRange(0, 100);
    // 实例化垂直滑动条对象
    verticalSlider = new QSlider(Qt::Vertical, this);
    // 设置显示的位置与大小
    verticalSlider->setGeometry(450, 10, 20, 150);
    // 设置值范围
    verticalSlider->setRange(0, 100);
    // 实例化标签文本
    label = new QLabel("滑动条值: 0", this);
    label->setGeometry(350, 100, 100, 20);
    // 信号槽连接
    connect(horizontalSlider, SIGNAL(valueChanged(int)), this, SLOT(horizontalSliderValueChanged(int)));
    connect(verticalSlider, SIGNAL(valueChanged(int)), this, SLOT(verticalSliderValueChanged(int)));

}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::verticalSliderValueChanged(int val)
{
    // 当垂直滑动条的值改变时,改变水平滑动条的值
    horizontalSlider->setSliderPosition(val);
}

 (4)程序编译运行的结果如下。当程序初始化时,滑动条控件的显示如下。 Label 显示的初始值为 0,当拖动任意一个滑动条来改变当前的值,另一个滑动条的值也在变。

2.4 QKeySequenceEdit组件-捕获键盘快捷键

Qt中的QKeySequenceEdit是一个用于捕获键盘快捷键序列的小部件。这个组件允许用户输入一个快捷键序列,然后可以将这个序列用于应用程序中的快捷操作。以下是其主要功能设置:

  • 设置和获取键序列:可以通过setKeySequence(const QKeySequence &keySequence)方法设置键序列,通过keySequence()方法获取当前的键序列。

  • 清除键序列clear()方法可以清除当前输入的键序列。

  • 键序列改变信号:当键序列发生变化时,QKeySequenceEdit会发出keySequenceChanged(const QKeySequence &keySequence)信号。你可以连接这个信号到一个槽函数,以便在键序列改变时执行某些操作。

  • 显示已输入的键序列QKeySequenceEdit会在其文本框中显示已输入的键序列。

  • 键序列验证QKeySequenceEdit会自动验证输入的键序列。如果用户输入的键序列无效,它将不会被接受。

  • 自动处理特殊键QKeySequenceEdit会自动处理一些特殊的键,例如Shift、Control、Alt和Meta键。

  • 定制外观:你可以使用Qt样式表(QSS)来定制QKeySequenceEdit的外观,例如改变背景颜色、边框等。

自定义快捷键通常 KeySequenceEdit 控件记录快捷键后与 Qt 键盘事件搭配来使用,由于教程后面才说到事件,所以先不与 Qt 键盘事件搭配使用。下面使用一个 QKeySequenceEdit 控件,然后判断输入的组合键是否为 Ctrl + Q,若是,则关闭窗口,退出程序,如果不是,则继续更新记录组合键。

(1)为了简便,直接在上节的项目中添加代码。

(2)在头文件“mainwindow.h”修改代码,具体代码如下。1)导入<QKeySequenceEdit>文件 —> 2)声明QKeySequenceEdit 对象。 —> 3)声明QKeySequenceEdit槽函数。完整代码如下。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QLabel>
#include <QKeySequenceEdit>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    //声明 QKeySequenceEdit 对象
    QKeySequenceEdit *keySequenceEdit;

private slots:
    // 声明QKeySequenceEdit槽函数
    void KSEKeySequenceChanged(const QKeySequence &);
};
#endif // MAINWINDOW_H

(3)在文件“mainwindow.cpp”修改代码,具体代码如下。 1)设置主窗体的显示位置与大小。—> 2)实例化QKeySequenceEdit对象和显示位置与大小。—>3)信号槽连接。—>4)写出槽函数,捕获键盘输入值。添加完整代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

#include <QDebug>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    // 设置主窗体的位置与大小
    this->setGeometry(0, 0, 800, 480);

    /****** 4 ******/
    // 实例化
    keySequenceEdit = new QKeySequenceEdit(this);
    // 设置位置与大小
    keySequenceEdit->setGeometry(500, 140, 200, 20);
    // 信号槽连接
    connect(keySequenceEdit,SIGNAL(keySequenceChanged(const QKeySequence &)),this,SLOT(KSEKeySequenceChanged(const QKeySequence &)));
}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::KSEKeySequenceChanged(const QKeySequence &keySequence)
{
    // 判断输入的组合键是否为 Ctrl + Q,如果是则退出程序
    if(keySequence == QKeySequence(tr("Ctrl+Q"))) {
        // 结束程序
        this->close();
    }else {
        // 打印出按下的组合键
        qDebug()<<keySequence.toString()<<endl;
    }
}

 (4)序编译运行的结果如下。按下键盘里的任一键或者组合键 ,一秒后 ,KeySequenceEdit 将记录了这个/这组组合键,并打印在输出信息里。直到程序按下 Ctrl + Q 组合键后,程序窗口才关闭,结束。

 

标签:控件,Qt,int,滚动条,3.4,设置,滑动,MainWindow
From: https://blog.csdn.net/qq_41921826/article/details/136758699

相关文章

  • 2-使用Rabbit MQ配置mqtt服务
    安装RabbitMQ开放端口15672,5672,25672,61613,1883应该可以只开放15672,1883和5672#15672:web管理界面5672:消费者访问的端口61613、1883:内部通信5672:通信口#查看是否开放udolsof-i:XXX或者拉取并创建容器一起完成dockerrun-d--namerabbit-eRABBITMQ_DEFAU......
  • qt使用本地字体文件
    qt使用本地字体文件qml工程设置使用本地字体文件#include<QGuiApplication>#include<QQmlApplicationEngine>#include<QDebug>#include<QFontDatabase>intmain(intargc,char*argv[]){QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);......
  • 使用MQTT.fx和自定义Client(Ubuntu上实现)测试MQTT服务器(EMQX )
    目录概述1配置EMQX做MQTT服务器1.1登录EMQX1.2配置EMQX1.2.1配置客户端认证1.2.2创建用户2测试MQTT服务器2.1配置MQTT.fx工具2.2连接MQTT服务器3使用MQTT.fx发布和订阅信息3.1在MQTT.fx上发布信息3.2在MQTT.fx上订阅信息4Ubuntu上实现MQTTClient4......
  • Canvas 控件
    在C#中中设置控件坐标Labellabel=newLabel{Content="测试",FontSize=14,Foreground=newSolidColorBrush((Color)ColorConverter.ConvertFromString("#FF0000"))};Canvas.SetTop(label,10.9);//在c#后台代码中动态设置Canvas.SetLeft(label,......
  • Qt 线程池 QThreadPool
    一.Qt线程池QThreadPool介绍Qt线程池是一种管理多个线程的并发编程模型,通过使用线程池可以提高性能、控制并发度、提供任务队列和简化线程管理。在Qt中,线程池的使用主要涉及以下几个步骤:创建任务类:需要定义一个任务类,该类继承自QRunnable和QObject,以便于能够在线程中运行......
  • Qt QCheckBox设置复选框的大小
    Qt设计QCheckBox样式表QCheckBox的各部分代表的样式表1QCheckBox2{3background-color:rgb(85,170,255);4color:yellow;5}67QCheckox::indicator:unchecked8{9/*设置边框的风格*/10border-style:solid;11border-width......
  • QT TreeWidget控件实现文件树 展示目录结构
    目录1、获取盘符,以及一级子文件2、getFileOnDirectory函数,遍历指定文件夹的一级子文件3、绑定展开信号和槽函数,遍历指定文件4、QTreeWidgetItem::setData()用法如图所示,这里仅仅实现展示目录结构,对于新增文件、修改文件、删除文件会后续补充。 思路:这里我并没有在程序......
  • Qt QtCharts给QChartView换肤,换背景色添加背景图片
    换色setBackgroundBrush这种接口可以设置QChartView背景色首先,给QChart类去掉背景渲染:换肤1QChart*chart=newQChart();2chart->setTheme(QChart::ChartThemeLight);这里chart是你自检的chart进入枚举一共有多个,可以自己看下,那个更适合。换背景下面展示一些内联......
  • Qt Charts 自定义样式
    QtCharts是Qt框架中用于创建图表和图形可视化的模块,它提供了一些内置的图表类型,如折线图、柱状图、饼图等。如果你想要自定义QtCharts中图表的样式,你可以使用一些方法来实现。以下是一些自定义QtCharts样式的方法:1、使用QChart的样式属性: QtCharts中的QChart类具有许多属性......
  • QT QChart去掉边缘区域
     QChart默认会留白、端点处圆形化处理,需要人手修改1chart->layout()->setContentsMargins(0,0,0,0);2chart->setBackgroundRoundness(0); 修改后的效果......