- 目标: 封装一个滑动改变显示数值的小控件(Spin Box + Horizontal Slider)
- 创建工程之后, 再新增一个smallwidget类, 在这个控件类中实现自定义的控件部分;
1. smallwidget
1.1 设计UI(smallwidget.ui)
- 拖动Spin Box和Horizontal Slider控件, 水平布局, 再调整整个widget的大小, 为这个widget修改name:
1.2 smallwidget.h
- 新增了两个函数, 等下有用
#ifndef SMALLWIDGET_H
#define SMALLWIDGET_H
// 封装自定义控件
#include <QWidget>
namespace Ui {
class smallWidget;
}
class smallWidget : public QWidget
{
Q_OBJECT
public:
explicit smallWidget(QWidget *parent = nullptr);
~smallWidget();
// 设置数字
void setNum(int num);
// 获取数字
int getNum();
private:
Ui::smallWidget *ui;
};
#endif // SMALLWIDGET_H
1.3 smallwidget.cpp
-
实现绑定信号和槽, 使得拖动slider的时候, Spin Box 数值会变化; Spin Box数值变化的时候, Slider会滑动;
-
注意!
: 经过查阅文档之后, 发现QSpinBox的Signals中有两个valueChanged信号, 所以, 这里连接的时候会注意重载;
#include "smallwidget.h"
#include "ui_smallwidget.h"
smallWidget::smallWidget(QWidget *parent) :
QWidget(parent),
ui(new Ui::smallWidget)
{
ui->setupUi(this);
// 函数指针
// int(*p)(int, int); 这个语句就定义了一个指向函数的指针变量 p。
// 首先它是一个指针变量,所以要有一个“*”,即(*p);其次前面的 int 表示这个指针变量可以指向返回值类型为 int 型的函数;后面括号中的两个 int 表示这个指针变量可以指向有两个参数且都是 int 型的函数。
// 两个连接, QSpinBox移动, QSlider移动;QSlider移动, QSpinBox移动
// 查阅文档, 发现,QSpinBox的Signals中有两个valueChanged, 所以这里关于信号重载要处理一下, 否则连接会报错
// void valueChanged(int i)
// void valueChanged(const QString &text)
// 函数指针写法
//定义了一个指针变量 p,该指针变量可以指向返回值类型为 int 型,且有两个整型参数的函数。p 的类型为 int(*)(int,int)。
//函数返回值类型 (* 指针变量名) (函数参数列表);
//要加作用域
void (QSpinBox:: * SB)(int) = &QSpinBox::valueChanged;
connect(ui->spinBox, SB, ui->horizontalSlider, &QSlider::setValue);
connect(ui->horizontalSlider, &QSlider::valueChanged, ui->spinBox, &QSpinBox::setValue);
}
// 实现函数后, 要与widget关联
void smallWidget::setNum(int num)
{
ui->spinBox->setValue(num);
}
int smallWidget::getNum()
{
return ui->spinBox->value();
}
smallWidget::~smallWidget()
{
delete ui;
}
- 以上, 自定义控件就封装好了;
2. widget
- 在这个主控件中, 使用自定义控件;
- 可以看到类smallwidget也是继承自QWidget, 所以, 这里可以使用widget控件接收, 如下图所示:
2.1 提升类(即设置自定义控件类)
2.2 widget.cpp
- widget头文件中大致没有什么修改的内容, 所以这里跳过到widget.cpp
- 提升之后, widget.ui中的控件smallwidget(对象名也改过了)就可以直接使用自定义控件类中封装好的两个方法
#include "widget.h"
#include "ui_widget.h"
#include <QDebug>
Widget::Widget(QWidget *parent)
: QWidget(parent)
, ui(new Ui::Widget)
{
ui->setupUi(this);
// 获取控件当前的值
connect(ui->btn_get, &QPushButton::clicked, this, [=](){
qDebug() << ui->smallwidget->getNum();
});
// 设置控件值到一半
connect(ui->btn_set, &QPushButton::clicked, this, [=](){
ui->smallwidget->setNum(50);
});
}
Widget::~Widget()
{
delete ui;
}