DAY1-Qt开发环境,基本窗口,信号和槽

364 阅读7分钟

image-20220729180230814

Qt的简介

历史

Qt是挪威TrollTech开发的跨平台的基于C++的专注于图形界面的开源应用程序框架

1996 ----- Qt 1.0
....
2019 ----- Qt 5.14(5.15)
2021 ----- Qt 6(6.2)

优势

优良的跨平台特性

支持的平台:windows Linux Android IOS OS FreeBSD ANX AIX...

面向对象

模块化程度很高,模块之间的写作和管理非常方便

丰富的API

Qt中有多达500多个预定义的类,基于模板实现了应用层的几乎所有功能

(4)大量详细的开发说明文档

Qt的典型应用产品

YY语音
Adobe Photoshop
Google Earth
Opera浏览器
.....

开发环境

可视化工具

Qt Designer -------- Qt设计师
Qt Assistant ------- Qt技术文档浏览器
Qt Linguist -------- 图像化翻译工具
Qt Creator --------- IDE(继承开发环境)
​
//非图形化的工具 ---- pro qmake

下载安装

5 . 14

juejin.cn/post/722769…

image.png

image.png

image.png

image.png

mirrors.aliyun.com/qt/archive/…

Qt Creator的使用

创建一个空的Qt项目

文件 ===> 新建文件或项目 ===> 其他项目 ===> Empty qmake project ===> 设置项目名和保存路径
===> Kits选择MinGW ===> 完成
​
//项目保存路径中不能带中文

往项目中添加C++元代吗

鼠标右键点击项目名 ===> Add New... ===> C++ ===> C++ Source file ===> 设置文件名 ===> 完成

往项目中添加Qt的模块

在项目管理文件(.pro)中添加一行
    QT += widgets
//这一行表示将Qt的窗口模块加入到项目
//窗口模块相关的类 -------- Qt中使用某个类要包含和类名相同的头文件
    QApplication ----- 应用程序时间循环类
    QWidget ------- 标准窗口类
    QLabel ------ 标签类

Qt中主函数的设计

#include <QApplication>
#include <QtWidgets>
​
​
int main(int argc,char *argv[])
{
    QApplication app(argc,argv);
​
    //具体操作
    //创建一个窗口对象,显示
   QWidget w;
   w.show();
​
​
    return app.exec();
}
​
​
//.pro文件   项目管理文件   项目目录再建一个文件夹    
       
QT += widgets

SOURCES += \
    main.cpp

image-20220729205055300

image-20220731143051217

练习:

新建一个项目,显示一个窗口

#include <QApplication>
#include <QtWidgets>
#include <QLabel>
int main(int argc,char *argv[])
{
    QApplication app(argc,argv);
    //具体操作
   QWidget w;

   QLabel lab(&w);  //作为一个父对象传入
   lab.setText("Hell,欢迎点击");

   w.show();
    return app.exec();
}

image-20220729210357224

4.窗口部件和对象之间的父子关系

Qt的对象之间可以有父子关系(构造对象时指定),如果希望一个窗口部件属于某个窗口,只需要将窗口部件的父对象设置为对应窗口即可。当窗口部件/窗口之间有父子关系,显示父对象时同时显示子对象,子对象的内存释放可以由父对象完成,当父对象释放时,自动释放子对象。

Qt中几乎所有的类都直接/间接继承自QObject,QObject继承产生的子类对象的内存都可以交给父类对象来释放。特性:

1.子对象可以由父对象释放(父对象释放时自动释放子对象)
2.子对象可以自己释放
3.没有父对象的对象堆内存需要自己释放
4.只有QObject的子类/间接子类才能由父对象释放

创建一个Qt的窗口工程

文件 ===> 新建文件或项目 ===> Application ===> Qt Widgets Application ===>
设置项目名和保存路径 ===> qmake ===> 选择继承的窗口类型(QWidget)和窗口类名(去掉ui的勾) ===>
Kits选择MinGW ===> 完成

image-20220731143114033

窗口常见的成员函数

show ----- 向上级窗口
setText ----- 设置显示的文字
resize(宽,高) ----- 设置窗口大小
move(横坐标,纵坐标) ----- 设置窗口显示的左上角坐标
setWindowTitle(窗口标题) ----- 设置窗口标题

//窗口中的窗口部件应该设置为窗口类的成员
setFont(QFont &f) ----- 设置字体  QFont ----- 字体类 
setPalettle(QPalette &p) ------ 设置调色板  QPalette ----- 调色板类
                                          setColor ----- 设置颜色  QColor ----- 颜色类

setCursor(QCursor &c) ----- 设置鼠标形状  QCursor - 鼠标属性类

练习:

设计一个Qt的窗口,大小1024X768,上面有2个QLabel

一个显示"下雨了,收衣服了" ------- (100,100)位置,大小300X50,颜色蓝色,字体16X16 斜体

另一个显示"你骗人,没下雨" ------ (240,240)位置,颜色红色,鼠标显示小手

image-20220729221949202

//mywidget.h
    #ifndef MYWIDGET_H
#define MYWIDGET_H

#include <QWidget>
#include <QLabel>

class MyWidget : public QWidget
{
    Q_OBJECT

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

private:
    QLabel *lab1;
    QLabel *lab2;
};
#endif // MYWIDGET_H
//main.cpp
#include "mywidget.h"

#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MyWidget w;

    //设置大小
    w.resize(1024,768);

    w.show();
    return a.exec();
}
#include "mywidget.h"
#include <QFont>
#include <QPalette>
#include <QColor>
#include <QCursor>

MyWidget::MyWidget(QWidget *parent)
    : QWidget(parent)
{
    //初始化窗口部件成员
    lab1 = new QLabel(this);
    lab2 = new QLabel(this);

    //设置文字
    lab1->setText("下雨了,收衣服了");
    lab2->setText("你骗人,没下雨");
    lab1->resize(300,50);
    //移动位置
    lab1->move(100,100);
    lab2->move(240,240);

    //设置lab1的字体
    QFont f("Times",16,16,true/*斜体*/);
    lab1->setFont(f);

    //设置lab1字体的颜色
    QColor c(0,0,255);
    QPalette p;//调色板
    p.setColor(QPalette::WindowText/*设置文本颜色*/,c);
    lab1->setPalette(p);//设置调色板

    c.setRgb(255,0,0);
    p.setColor(QPalette::WindowText/*设置文本颜色*/,c);
    lab2->setPalette(p);//设置调色板

    //设置鼠标形状
    QCursor cs(Qt::PointingHandCursor/*小手*/);
    lab2->setCursor(cs);
}

MyWidget::~MyWidget()
{

}

image-20220729222456271

QPushButton(按钮类) ---------- 信号(signal)和槽(slot)

Qt中信号和槽的机制

1.信号和槽用于Qt对象之间的通信,信号可以由某种动作触发,也可以由代码直接触发
2.槽也叫槽函数,当完成了信号和槽的连接之后,一旦触发信号,自动调用连接的槽函数
3.信号和槽的连接时动态,对象释放后自动断开所有的信号和槽
4.代码触发信号的写法
    emit 信号;//信号的格式是函数声明的形式,但是无需实现。

image-20220731143137798

信号和槽的声明

1.在Qt的类中如果要使用信号和槽,必须在类的声明加Q_OBJECT宏
2.信号的声明
signals:
    信号的声明;
2.槽函数的声明
public/protected/private slots:
    槽函数的声明;    
    
//QPushButton是一个按钮类,点击按钮会触发信号void clicked();    

如何连接信号和槽

1.只有类型相同的信号和槽才能连接
2.一个信号可以连接多个槽,一个槽也可以连接多个信号
3.语法
    QObject::connect(发送信号对象的地址,信号,接收信号的对象,槽函数);
    //实现方法有三种
    QObject::connect(btn,SIGNAL(clicked()),this,SLOT(btn_clicked()));
    QObject::connect(btn,&QPushButton::clicked,this,&MyPushButton::btn_clicked);
    //使用Lambda表达式
    QObject::connect(btn,&QPushButton::clicked,this,[&](){
        qDebug()<<"Lambda表达式slot";
    });

断开信号和槽

QObject::disconeect(参数和connect一样);
//对象销毁时自动断开信号和槽,该函数几乎不用

信号的传递

一个信号可以连接另外一个信号,当前一个信号发射后会自动触发下一个信号,信号可以通过该方式传递下去。

信号与信号连接的语法:

QObject::connect(btn,SIGNAL(信号...),this,SIGNAL(信号...));

练习:

设计一个窗口,窗口有3个按钮和1个标签,点击按钮1标签的文字显示红色,

点击按钮2标签的文字显示绿色。 点击按钮3标签的文字显示蓝色

image-20220730105614508

//changelab.h
#ifndef CHANGELAB_H
#define CHANGELAB_H

#include <QWidget>
#include <QLabel>
#include <QPushButton>

class ChangeLab : public QWidget
{
    Q_OBJECT

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

private:
    QLabel *lab;
    QPushButton *red_btn;
    QPushButton *green_btn;
    QPushButton *blue_btn;

};
#endif // CHANGELAB_H
//changelab.cpp
#include "changelab.h"

ChangeLab::ChangeLab(QWidget *parent)
    : QWidget(parent)
{
    lab = new QLabel("你好",this);
    red_btn = new QPushButton("红色",this);
    green_btn = new QPushButton("绿色",this);
    blue_btn = new QPushButton("蓝色",this);

    lab->move(480,200);
    red_btn->move(200,600);
    green_btn->move(550,600);
    blue_btn->move(700,600);

    QObject::connect(red_btn,&QPushButton::clicked,this,[&](){
        QColor c(255,0,0);
        QPalette p;//调色板
        p.setColor(QPalette::WindowText/*设置文本颜色*/,c);
        lab->setPalette(p);//设置调色板
    });

    QObject::connect(green_btn,&QPushButton::clicked,this,[&](){
        QColor c(0,255,0);
        QPalette p;//调色板
        p.setColor(QPalette::WindowText/*设置文本颜色*/,c);
        lab->setPalette(p);//设置调色板
    });
    QObject::connect(blue_btn,&QPushButton::clicked,this,[&](){
        QColor c(0,0,255);
        QPalette p;//调色板
        p.setColor(QPalette::WindowText/*设置文本颜色*/,c);
        lab->setPalette(p);//设置调色板
    });

}

ChangeLab::~ChangeLab()
{

}

Qt帮助手册

打开

1.直接在界面点击帮助按钮
2.将光标移动到想要查看的类/函数上,按F1

image-20220731143158843

内容

image-20220731143208424

image-20220731143215097

作业:

设计一个窗口,包含一个QLabel,两个QPushButton,实现以下功能

1.点击第一个按钮(改变内容)使QLabel的内容在"你好""再见"之间切换
2.点击第二个按钮(改变颜色)使QLabel的颜色在蓝色和绿色之间切换
//changelab.h

#ifndef CHANGELAB_H
#define CHANGELAB_H

#include <QWidget>
#include <QLabel>
#include <QPushButton>

class ChangeLab : public QWidget
{
    Q_OBJECT

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

private:
    QLabel *lab;
    QPushButton *text_btn;
    QPushButton *color_btn;

    bool text_flag;
    bool color_flag;
};
#endif // CHANGELAB_H
//changelab.cpp

#include "changelab.h"
#include <QColor>
#include <QPalette>

ChangeLab::ChangeLab(QWidget *parent)
    : QWidget(parent)
{
    lab = new QLabel("你好",this);
    text_btn = new QPushButton("切换内容",this);
    color_btn = new QPushButton("切换颜色",this);

    text_flag = true;
    color_flag = true;

    lab->move(360,100);
    text_btn->move(200,300);
    color_btn->move(600,300);

    QObject::connect(text_btn,&QPushButton::clicked,this,[&](){
        if(text_flag){
            lab->setText("再见");
            text_flag = false;
        }
        else{
            lab->setText("你好");
            text_flag = true;
        }
    });

    QObject::connect(color_btn,&QPushButton::clicked,this,[&](){
        if(color_flag){
            QColor c(0,255,0);
            QPalette p;
            p.setColor(QPalette::WindowText,c);
            lab->setPalette(p);
            color_flag = false;
        }
        else{
            QColor c(0,0,255);
            QPalette p;
            p.setColor(QPalette::WindowText,c);
            lab->setPalette(p);
            color_flag = true;
        }
    });
}

ChangeLab::~ChangeLab()
{
}
//main.cpp
#include "changelab.h"

#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    ChangeLab w;

    w.resize(800,480);

    w.show();
    return a.exec();
}

设计一个窗口,包含一个QLabel,两个QPushButton,并且加一个开关开启所有的功能,实现以下功能