【QT】按钮类控件 显示类控件

目录

按钮类控件

Push Button

设置按钮图标

按钮设置快捷键

设置鼠标点击按钮重复触发

Radio Button

 单选框分组

Check Box 

显示类控件

Label

常用属性

设置文本格式

给Label设置图片 

Label标签设置边框

设置文本对齐方式

设置文本自动换行

设置文本缩进

设置边距

label设置伙伴 

LCD Number

核心属性

示例：倒计时

ProgressBar

核心属性 

示例：进度条

改变进度条的颜色 

Calendar Widget 

核心属性

重要信号 

按钮类控件

Push Button

使用QPushButton表示一个按钮，QPushButton继承自QAbstractButton，这个类是一个抽象类，是其他按钮的父类。

QAbstractButton 中, 和 QPushButton 相关性较⼤的属性  

设置按钮图标

// 创建图标
QIcon icon(":/doge.png");
// 设置图标
ui->pushButton->setIcon(icon);
// 设置图标⼤⼩
ui->pushButton->setIconSize(QSize(50, 50));

按钮设置快捷键

写法一：

这种方法比较不容易出错

ui->pushButton_up->setShortcut(QKeySequence(Qt::Key_W));
ui->pushButton_down->setShortcut(QKeySequence(Qt::Key_S));
ui->pushButton_left->setShortcut(QKeySequence(Qt::Key_A));
ui->pushButton_right->setShortcut(QKeySequence(Qt::Key_D));

写法二： 

ui->pushButton_up->setShortcut(QKeySequence("w"));
ui->pushButton_down->setShortcut(QKeySequence("s"));
ui->pushButton_left->setShortcut(QKeySequence("a"));
ui->pushButton_right->setShortcut(QKeySequence("d"));

要设置组合快捷键的话，只需要要用 + 连接

ui->pushButton_up->setShortcut(QKeySequence(Qt::CTRL+Qt::Key_W));

 或者

ui->pushButton_right->setShortcut(QKeySequence("ctrl+d"));

设置鼠标点击按钮重复触发

键盘事件的重发触发默认开启

ui->pushButton_up->setAutoRepeat(true);

Radio Button

 单选框分组

有时候一个界面需要多个单选按钮组，组和组之间不能有排他，组内部排他，因此我们引入QButtonGroup类来进行分组

// 创建三个 QButtonGroup

QButtonGroup* group1 = new QButtonGroup ( this );

QButtonGroup* group2 = new QButtonGroup ( this );

QButtonGroup* group3 = new QButtonGroup ( this );

// 把 QRadioButton 两两⼀组 , 放到三个 QButtonGroup 中 .

group1-> addButton (ui->radioButton);

group1-> addButton (ui->radioButton_2);

group2-> addButton (ui->radioButton_3);

group2-> addButton (ui->radioButton_4);

group3-> addButton (ui->radioButton_5);

group3-> addButton (ui->radioButton_6)；

Check Box 

ui->check_box->ischecked();

获取多选框文本

ui->check_box->text(); 

显示类控件

Label

常用属性

设置文本格式

    //第一个label设置成显示纯文本

    ui->label_1->setTextFormat(Qt::PlainText);

    ui->label_1->setText("这是⼀段纯⽂本");

    //第二个label设置成显示富文本

    ui->label_2->setTextFormat(Qt::RichText);

    ui->label_2->setText("<b> 这是⼀段富⽂本 </b>");

    //第三个label设置成显示 markdown

    ui->label_3->setTextFormat(Qt::MarkdownText);

    ui->label_3->setText("## 这是⼀段 markdown ⽂本");

给Label设置图片 

    //先把QLabel 设置成和窗口一样大，并且把这个QLabel左上角窗口的左上角

    //让整个QLabel铺满窗口

    QRect windowRect = this->geometry();

    ui->label->setGeometry(0,0,windowRect.width(),windowRect.height());

    QPixmap pixmap(":/1.png");

    ui->label->setPixmap(pixmap);

    //QLalel跟窗口一样大了，但是图片不一定，因此需要拉伸图片

    ui->label->setScaledContents(true);

上述代码我们是在窗口构造函数中写的，因此我们如果再对窗口进行放大缩小，图片并不能随之变化，这里可以让Wiget窗口类，重写父类（QWidget） resize 事件 （resizeEvent虚函数）

在鼠标拖动窗口尺寸的过程中，resizeEvent虚函数会被反复调用执行，每次触发一个resizeEvent事件都会调用以此对应的虚函数，调用父类的虚函数就会实际调用子类的对应的函数（多态）

代码示例：

widget.h

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();
//这里
    void resizeEvent(QResizeEvent *event);


private:
    Ui::Widget *ui;
};
#endif // WIDGET_H

 widget.cpp

#include "widget.h"
#include "ui_widget.h"
#include <QLabel>
#include <QResizeEvent>


//此处的形参event是非常有用的，这里就包含了触发这个resize事件这一时刻，窗口的尺寸的数值
void Widget::resizeEvent(QResizeEvent *event)
{
    ui->label->setGeometry(0,0,event->size().width(),event->size().height());
}

Label标签设置边框

设置文本对齐方式

//垂直水平居中

 ui->label_1->setAlignment(Qt::AlignHCenter | Qt::AlignVCenter);

Qt::AlignHCenter ：水平方向上居中

Qt::AlignVCenter ：垂直方向上居中

……

多个文本对齐方式之间使用 “ | ” 

设置文本自动换行

ui->label_1->setWordWrap(true);

设置文本缩进

    ui->label_1->setWordWrap(true);

    ui->label_1->setIndent(50);

有多行时，每行都会产生缩进 

设置边距

ui->label_1->setMargin(10);

与indent不同的是，Margin是上下左右四个方向都一样的边距 

label设置伙伴 

示例界面如下：

 Qt中，QLabel中写的文本，是可以指定“快捷键”，此处快捷键的规则功能上要比QPushButton弱很多，是在文本中使用 & 跟上一个字符来表示快捷键，比如 &A ,我们可以通过键盘上的 alt+a来触发快捷键。

绑定了伙伴关系之后，通过快捷键就可以选中对应的单选按钮/复选按钮，这里的快捷键是在文本中写 &A 类似的就可以了

LCD Number

QLCDNumber 是一个专门用来显示数字的控件，类似于“老式计算机” 的效果。

核心属性

示例：倒计时

C++标准库中，没有提供定时器的实现，Boost里面提供了对应的功能

Qt中也封装了对应的定时器（结合了信号槽的机制）

QTimer 通过这个类创建出来的对象，就会产生一个timeout这样的信号，可以通过start方法来开启定时器，并且参数中设定触发timeout信号的周期，这样结合connect，把这个timeout信号绑定到需要的槽函数中，就可以执行逻辑，修改LCD Number上面的数字了

代码如下：

widget.h

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

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

    void handle();
private:
    Ui::Widget *ui;
    QTimer*  timer;
};
#endif // WIDGET_H

widget.cpp

#include "widget.h"
#include "ui_widget.h"
#include <QTimer>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);


    //初始值
    ui->lcdNumber->display("10");

    //创建一个QTimer实例
    timer=new QTimer(this);
    //把QTimer的timeout信号和咱们自己的槽函数进行连接
    connect(timer,&QTimer::timeout,this,&Widget::handle);

    //启动定时器,参数是触发timeout的周期，单位是ms
    timer->start(1000);
}

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

void Widget::handle()
{
    //先拿到LCDNumber中的数字
    int value=ui->lcdNumber->intValue();
    if(value<=0)
    {
        timer->stop();
        return;
    }
    ui->lcdNumber->display(value-1);
}

不使用QTimer的另一种写法（实际不可行）

#include "widget.h"
#include "ui_widget.h"
#include <thread>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);


    //初始值
    ui->lcdNumber->display("10");

    int value=ui->lcdNumber->intValue();
    while(true){
        std::this_thread::sleep_for(std::chrono::seconds(1));
        if(value<=0)
        {
            break;
        }
        ui->lcdNumber->display(--value);
    }
}

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

对于GUI来说，内部包含了很多的隐藏状态，Qt为了保证修改界面的过程中，线程安全是不会受到影响的，Qt禁止了其他线程直接修改界面，因此Qt为了确保线程安全，直接要求所有的对界面的修改操作，必须在主线程中完成，对于槽函数来说，默认情况下，槽函数都是由主线程调用的。

ProgressBar

使⽤ QProgressBar 表示一个进度条

核心属性 

示例：进度条

 代码示例：

widget.h

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();
    void handle();
private:
    Ui::Widget *ui;
    QTimer* timer;

};
#endif // WIDGET_H

widget.cpp

#include "widget.h"
#include "ui_widget.h"
#include <QTimer>
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    timer=new QTimer(this);
    connect(timer,&QTimer::timeout,this,&Widget::handle);

    timer->start(100);

}

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

void Widget::handle()
{
    int value=ui->progressBar->value();
    if(value>=100)
    {
        timer->stop();
        
        return;
    }
    ui->progressBar->setValue(value+1);
}

在上述示例代码中，widget.h中用到了QTimer，但是却没在.h文件中包含<QTimer>头文件，为啥这个代码编译不会出错？例如“找不到定义”之类的？

上述问题其实是通过Qt内部提供的一个特殊技巧来实现的，在Qt中，有一个专门的头文件，这个头文件包含了Qt中所有类的“前置声明”，例如class QTimer；

Qt中问什么要使用上述的技巧，上述的技巧能解决什么问题?有啥提升呢？

主要解决的是编译速度的问题，C/C++的代码，编译速度在其他语言横向对比中，是非常慢的，因为C++编译速度慢和 #include头文件，有直接关系的，由于include关系错综复杂，因此，尽可能减少include头文件的个数，就可以有效的减少编译时间，Qt中就使用class前置声明的方式，来尽量减少头文件的包含

改变进度条的颜色 

Calendar Widget 

重要信号