Qt学习第一天：新建qt工程，编写helloWorld，按钮信号和槽

Qt学习第一天：新建qt工程，编写helloWorld，按钮信号和槽-CSDN博客

一，C++面向对象

学习qt要有一些c++面向对象的基础
C++的类与类之间存在上下级的关系，类可以继承另外一个类。被继承的类通常称作为是基类。
而主动继承的类通常被称作是派生类。

二，创建qt项目

1. 创建工程时选择的QWidget类。
   该工程的目的就是为了创建一个窗口，对Qt的界面开发，就是基于此工程的，可以在窗口上添加组件或者自由设计均可。
2. 然后一键next

三，目录详细介绍

1，C++程序的入口main.cpp

// widget.h是Qt生成窗口用的类，该类继承了QWidget类，也就意味着widget类包含了QWidget类的所有功能。
#include "widget.h"
// 大写的Q为开头的类，都是Qt提供给我们的类
#include <QApplication>
int main(int argc, char *argv[])
{
	// QApplication类作为Qt程序的入口实现。也作为程序的结束。
    QApplication a(argc, argv);
    // 实例化一个窗口类的对象w
    Widget w;
    // w.show()的作用是使得窗口能够显示出来
    w.show();
    return a.exec();
}

2，Qt生成窗口的类的头文件widget.h

#ifndef WIDGET_H
#define WIDGET_H
// 添加基类的头文件
#include <QWidget>
QT_BEGIN_NAMESPACE
// 声明命名空间Ui，Ui下声明了Widget类
namespace Ui { class Widget; }
QT_END_NAMESPACE
// Widget公共继承QWidget
class Widget : public QWidget
{
	// Qt提供给类的宏定义，里面包含了Qt的核心机制，必须要添加，否则极有可能造成程序编译错误。
    Q_OBJECT
public:
	// 构造函数：基类的指针，默认值为nullptr
    Widget(QWidget *parent = nullptr);
    // 析构函数，这里也是一个虚析构函数
    ~Widget();
private:
	// 命名空间下Widget类的指针
    Ui::Widget *ui;
};
#endif // WIDGET_H

3，Qt生成窗口的类的实现文件widget.cpp

#include "widget.h"
#include "ui_widget.h"

// 以下写法为构造函数的初始化列表
// 初始化列表在这里的作用是：
// 1) 将参数parent透过基类的构造函数传参，并调用基类的构造函数
// 2) 将ui指针实例化Ui::Widget对象
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
	// ui对象调用成员函数setupUi,其作用为，运行设计师界面的内容
    ui->setupUi(this);
}

Widget::~Widget()
{
	// 释放ui指针的堆空间
    delete ui;
}

四，写个hello world并调节其样式

1，通过代码实现

在widget.h头文件中添加

#include <QLabel>  // 声明组件所需要用到的类
QLabel *label;   // 声明组件所需要用到的指针

添加后

#ifndef WIDGET_H
#define WIDGET_H
#include <QWidget>
// 声明组件所需要用到的类
#include <QLabel>
QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACE
class Widget : public QWidget
{
    Q_OBJECT
public:
    Widget(QWidget *parent = nullptr);
    ~Widget();
private:
    Ui::Widget *ui;
	// 声明组件所需要用到的指针
    QLabel *label;
};
#endif // WIDGET_H

widget.cpp里

#include "widget.h"
#include "ui_widget.h"
Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
	// 调整窗口的大小
    resize(400, 300);
	// 实例化标签对象，第一个参数"Hello World"代表label的文本信息。
	// 第二个参数this，代表窗口，意思是将label标签贴在this窗口上
	label = new QLabel("Hello World", this);
	// setGeometry代表设置组件的几何信息，包括：x坐标，y坐标，w宽度，h高度
    label->setGeometry(0, 0, 400, 300);
    // setAlignment代表设置组件内字体的对齐方式，Qt::AlignCenter也代表将文字居中对齐
    label->setAlignment(Qt::AlignCenter);
    // setStyleSheet代表设置组件的样式表，其中可以修改字体的大小。
    label->setStyleSheet("font:50px");
}
Widget::~Widget()
{
    delete ui;
}

运行结果

拉伸窗口会发现Hello World会原位不动

设计样式1 将label组件始终放在窗口的正中间

在Qt生成的工程当中，如果没有添加组件，并且可以拉伸窗口大小的话，拉太小可能会隐藏窗口上的组件，拉太大又有些影响美观，所以我们想要，保持组件们一直持续显示在窗口的正中央。

1) 在widget.h头文件中添加

#include <QHBoxLayout>  // 声明组件所需要用到的类
QHBoxLayout *hboxlayout;  // 声明组件所需要用到的指针

上同

2) widget.cpp里添加

// QHBoxLayout的基类是QBoxLayout，他还有一个兄弟，为QVBoxLayout，自己是水平布局，兄弟是垂直布局。
// 所有的布局往上的基类都是QLayout
hboxlayout = new QHBoxLayout(this);
// 在布局里添加组件
hboxlayout->addWidget(label);

这样如何拉伸界面Hello World都会在窗户正中央

设计样式2 样式表

在Qt中，修改组件或者窗口的字体、背景颜色等等，都可以通过设置样式表实现。
一些比较炫酷的界面效果也可以用样式表实现。

在如下的代码实例中，不同的样式表语句，需要用分号隔开，不然会引起冲突。
由于不会对函数内的字符串类型纠错，注意不得有拼写错误。

// font可以设置字体的样式
// background-color修改背景颜色
// color修改文本信息的颜色
// rgb表示颜色由红绿蓝三色组成，每个颜色的通道占据一个字节的数据(最大值为FF，255)
   label->setStyleSheet("font:50px;\
                         background-color:rgb(45, 9, 34);\
                         color:rgb(255, 255, 255);\
                        ");

在Qt中，也可以用QSS语句实现样式表的功能，QSS语句类似于HTML CSS语言，用{}整合想要的数据，在内部通过 “属性:数值” 的方式设置自己想要的效果

QString sheet = "QLabel\
					{\
					font:50px;\
					background-color:rgb(22, 22, 11);\
					color:rgb(19, 133, 33);\
					};";
label->setStyleSheet(sheet);

2，进入Qt设计师界面

先双击Forms文件夹下widget.ui文件，进入Qt设计师界面。

在左列中找到label，将label拖拽到窗口的正中间

在右上角对象与类的列表中，找到窗口Widget，点击选中窗口。
在右下角geometry可以修改窗口的尺寸，再同步以下label的位置。
选择label，在右下角找到alignment，水平和垂直均选择为Center，代表居中对齐。

选中label，找到font，透过调整点大小的值来修改字体的大小。

五，按钮

1，创建按钮

当我们在设计师界面中，将按钮放置在布局里时，按钮的高度并不会发生改变，同时变得很扁。这是因为它垂直的尺寸策略为fixed固定值，需要将其修改为与水平除了相一致的Minimum即可，或者统一修改为fixed，同时设置按钮尺寸的最小尺寸。

2，信号和槽

信号和槽其实是一个函数

QObject::connect()

connect函数的作用是连接信号和槽。

QObject类是Qt里最上层的类。绝大多数的Qt类往上，都会继承该类，也可以算是Qt里的祖宗类
该QObject可以用来表示窗口，也可以用来表示组件、控件的对象

QMetaObject::Connection 
QObject::connect(
                 const QObject *sender, // 信号的发送者
                 const char *signal,  // 具体的信号
                 const QObject *receiver, // 信号的接收者
                 const char *method, // 槽函数
                 Qt::ConnectionType type = Qt::AutoConnection
                 )

具体的信号和槽函数是分别通过SIGNAL()和SLOT()实现的。
这是两个宏定义函数，最终转换成了char* 字符串类型

1）点击按钮之后，将整个窗口显示全屏。

第一个方案：利用信号和槽的编辑界面来完成相应功能

先来到设计师界面，首先保证界面内有一个按钮。
在上方工具栏中点击第二个按钮，第二个按钮的意思就是edit signal/slot，专门用来编辑信号和槽的界面。

想要实现信号和槽，就要分析谁是信号的发送者？谁是信号的接收者？
在该案例中，点击按钮之后，窗口才会做出反应，所以信号的发送者就是按钮，信号的接收者为窗口。
点击按钮，长按，往外拖出一跟线，连接到窗口上。
在配置连接的对话框中，点击下方从QWidget继承的信号和槽，左边信号选择按钮的clicked()信号，右边的槽函数选择窗口的showFullScreen()槽函数。

第二个方案：通过转到槽来实现相应功能
来到设计师界面中，找按钮，右键点击，选择转到槽的操作。此时，需要选择连接的信号，选择clicked()。

跳转到代码页面中
此时widget.h会自动生成以下代码：

// 所有槽函数的声明都应该放在slots下，至于是public slots还是private slots都可以。
private slots:
	// 自动生成的槽函数，名称以on为开头，加上信号发送者的名字，再加上信号名称组成槽函数的名字。
    void on_pushButton_clicked();

此时widget.cpp也会自动生成以下代码：

void Widget::on_pushButton_clicked()
{
    // 写上槽函数的代码逻辑，即点击按钮之后会发生什么。
    // 例如: close(); 关闭窗口
    showFullScreen(); // 全屏显示
}

2) 反复点击按钮之后，可以使得label上的信息来回切换

widget.h

widget.cpp