基于C++的QT界面学习记录

下载安装

https://download.qt.io/archive/qt/5.9/5.9.0/

新建工程

在这里插入图片描述

QPushButton按钮相关

以下是纯代码实现,不是用.ui中控件拖拽

创建按钮

找到QPushButton所需包含的头文件
帮助->选择索引->搜索QPushBotton->找到Header

在这里插入图片描述
在这里插入图片描述

#include "mainwindow.h"
#include <QPushButton> //在帮助文档中找到QPushBotton所需要包含的头文件

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    QPushButton *btn = new QPushButton;//创建一个按钮
    btn->setParent(this);//让按钮依附在 窗口中,this指向当前对象的指针
    btn->setText("按钮1");//显示文本
    btn->resize(70,50);//设置按钮大小

    QPushButton *btn2 = new QPushButton("按钮2",this);//第二种创建按钮的方式
    btn2->move(60,0);//移动按钮

    resize(600,400);//重置窗口大小
    setFixedSize(600,400);//设置固定大小窗口,用户无法手动缩放

    setWindowTitle("第一个窗口");//设置窗口标题
}

MainWindow::~MainWindow()
{

}

按下按钮,关闭窗口

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    QPushButton *btn2 = new QPushButton("按钮2",this);
    //按下按钮,关闭窗口
    //参数:信号发送者、发送的信号、信号接受者(this指当前窗口对象)、处理的槽函数
    connect(btn2,&QPushButton::clicked,this,&MainWindow::close);
}

自定义信号与槽

小栗子:
下课后,老师发出信号:饿了,学生响应信号:请客
右击添加新文件C++ class自定义老师类,这个类不属于任何控件,所以让他继承 QObject这个最高

在这里插入图片描述

发送信号只需要在.h头文件中进行声明,写在signals:下

在这里插入图片描述

同理,学生类,要做响应的槽函数
.h文件中声明
.cpp文件中实现

在这里插入图片描述
在这里插入图片描述

窗口.h文件中 
1 包含两个类的头文件
2 声明	

在这里插入图片描述

在这里插入图片描述

Lambda表达式

语法:[=](){}
//中括号中写等号表示值传递,小括号写参数,没有参数就不写,大括号中写要调用的函数
作用:可以调用多个函数
#include "mainwindow.h"
#include <QPushButton> //在帮助文档中找到QPushBotton所需要包含的头文件

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    //创建对象
    this->xj = new Teacher(this);
    this->banana = new Student(this);//(this),是将对象放在对象树上,这样new出来堆区数据不用手动释放
    //老师饿了,学生请客,连接
    connect(xj,&Teacher::hungry,banana,&Student::treat);
    QPushButton *btn =new QPushButton("下课",this);//新建按钮
    btn->setParent(this);//让按钮依附在窗口中
    resize(600,400);//调整窗口大小
    //Lambda表达式:可以调用多个槽函数
    //调用老师饿了,学生请吃饭,并且实现单击后修改按钮名称
    connect(btn,&QPushButton::clicked,this,[=](){
         emit xj->hungry();
        btn->setText("改个名");
    });
}

MainWindow::~MainWindow()
{

}

QMainWindow

包含菜单栏、工具栏、状态栏等

基础设置

在这里插入图片描述

#include "mainwindow.h"
#include <QMenuBar> //包含菜单栏头文件
#include<QToolBar>//包含工具栏头文件
#include<QPushButton>
#include<QStatusBar>
#include<QLabel>
#include<QDockWidget>
#include<QTextEdit>
MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    resize(600,400);
    QMenuBar * bar= menuBar();//创建菜单栏
    setMenuBar(bar);//菜单栏放入窗口
    //创建菜单
    QMenu * fileMenu = bar->addMenu("文件");
    QMenu * EditMenu = bar->addMenu("编辑");
    //创建文件下拉菜单项
    fileMenu->addAction("新建");
    fileMenu->addSeparator();//添加分割线
    fileMenu->addAction("打开");
    EditMenu->addAction("编辑");
    //工具栏创建(可以有多个)
    QToolBar *toolbar=new QToolBar(this);
    addToolBar(toolbar);//将工具栏放在窗口中
    toolbar->addAction("gan");//工具栏添加信息
    toolbar->addSeparator();//工具栏添加分割线
    toolbar->addAction("kao");//工具栏添加信息
    //在工具栏中添加按钮
    QPushButton *btn=new QPushButton("按钮1",this);
    toolbar->addWidget(btn);
    //状态栏
    QStatusBar *stBar= statusBar();
    setStatusBar(stBar);//将状态栏放置到窗口中
    QLabel *label=new QLabel("提示信息",this);//创建标签控件
    stBar->addWidget(label);//将标签放在状态栏中
    QLabel *label2=new QLabel("右侧提示信息",this);
    stBar->addPermanentWidget(label2);//放在右侧提示
    //浮动窗口 可以有多个
    QDockWidget *dockwidget = new QDockWidget("浮动",this);
    addDockWidget(Qt::BottomDockWidgetArea,dockwidget);//浮动窗口在底部,其他位置,在帮助中搜Dockwidget
    //设置中心部件 记事本 只能一个
    QTextEdit *edit=new QTextEdit(this);
    setCentralWidget(edit);//设置在中间
}

MainWindow::~MainWindow()
{

}

功能段实现

以下是ui中拖拽控件后的实现

给控件加图标

以按钮为例

在这里插入图片描述

拖拽好按钮控件后,在cpp文件中
#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    ui->pushButton->setIcon(QIcon("/Users/air/Desktop/1.jpg"));//给按钮设置图标
}

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

Qlabel中显示静态图片

    ui->label->setPixmap(QPixmap("/Users/air/Desktop/out.jpg"));
    ui->label->setScaledContents(true);//图片自适应Qlabel大小

Qlabel显示gif动态图

#include<QMovie>   

    QMovie *movie=new QMovie("/Users/air/Desktop/1.gif");
    ui->label->setMovie(movie);
    ui->label->setScaledContents(true);
    movie->start();


点击 弹出自定义消息框

.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include<QDialog>        //对话框头文件
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //点击新建,弹出对话框
    connect(ui->actionnew,&QAction::triggered,[=](){
        //模块对话框,调用模态的方式(不可以对其他窗口进行操作)进行创建
       QDialog dlg(this);
       dlg.resize(300,200);//调整对话框大小
       dlg.exec();
        //非模块对话框(可以对其他窗口进行操作)
        QDialog *dlg2=new QDialog (this);//对象树释放是把整个界面关闭后才释放
        dlg2->resize(300,200);
        dlg2->show();
        dlg2->setAttribute(Qt::WA_DeleteOnClose);//点击对话框的小窗口的时候,就释放掉这里的数据
    });
    //点击按钮,弹窗
    connect(ui->pushButton,&QPushButton::clicked,this,[=](){
        QDialog dlg3(this);
        dlg3.resize(250,150);
        dlg3.exec();
    });
}

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

点击弹出 消息、错误、问题、报警对话框

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include<QDialog>        //对话框头文件
#include<QMessageBox>
#include<QDebug>
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //消息对话框
    //错误提示框
    QMessageBox::critical(this,"critical","错误");
    //信息对话框
    QMessageBox::information(this,"info","信息");
    //问题对话框,最后一个参数是默认回车键会选择的按钮,比如不选择直接回车键,这里是默认选择点击save
    if(QMessageBox::Save==QMessageBox::question(this,"question","提问",QMessageBox::Save|QMessageBox::Cancel,QMessageBox::Save))//类似的有OK、open、close、yes、no
    {
        qDebug()<<"选择保存";
    }
    else
    {
        qDebug()<<"选择取消";
    }
    //警告提示框
    QMessageBox::warning(this,"warning","警告");
}

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

选择文件 对话框

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include<QDialog>        //对话框头文件
#include<QMessageBox>
#include<QDebug>
#include<QFileDialog>
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    connect(ui->pushButton,&QPushButton::clicked,this,[=](){
        //文件对话框
       QString str= QFileDialog::getOpenFileName(this,"打开文件","/Users/air/Desktop");//默认打开桌面
        qDebug()<<str;//返回选取的文件的路径
    });
}

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

表格

在这里插入图片描述

在这里插入图片描述

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

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    ui->tableWidget->setColumnCount(3);//设置列数
    ui->tableWidget->setHorizontalHeaderLabels(QStringList()<<"姓名"<<"性别"<<"年龄");//水平表头
    ui->tableWidget->setRowCount(3);//行数

    QStringList nameList;
    nameList<<"亚瑟"<<"赵云"<<"安琪拉";
    QStringList sexList;
    sexList<<"男"<<"男"<<"女";
    QStringList ageList;
    ageList<<"12"<<"13"<<"23";

    for(int i=0;i<3;i++)
    {
        int col=0;
        ui->tableWidget->setItem(i,col++,new QTableWidgetItem(nameList[i]));
        ui->tableWidget->setItem(i,col++,new QTableWidgetItem(sexList[i]));
        ui->tableWidget->setItem(i,col++,new QTableWidgetItem(ageList[i]));
    }
}
MainWindow::~MainWindow()
{
    delete ui;
}

点击按钮 同一个局部切换不同页面

在stacked widget中构建好不同页面后 (见下面控件功能总结中的页面切换),设置按钮

在这里插入图片描述

确定各个页面的索引值

在这里插入图片描述

代码实现切换
#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //切换到网页按钮,objectName更改为btnWeb,方便记忆,该网页按钮索引值为1
    connect(ui->btnWeb,&QPushButton::clicked,[=](){
        ui->stackedWidget->setCurrentIndex(1);//按照索引值设置
    });
    //按钮切换到QQ列表,该页面索引值为0
    connect(ui->btnQQList,&QPushButton::clicked,[=](){
        ui->stackedWidget->setCurrentIndex(0);
    });
    //按钮切换到滑动区域,该页面索引值为2
    connect(ui->btnSlide,&QPushButton::clicked,[=](){
        ui->stackedWidget->setCurrentIndex(2);
    });
}

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

封装 进度条与计数器

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在新添加的ui中,拖拽好需要封装的控件

在这里插入图片描述

调整封装的大小

在这里插入图片描述

以后使用这个封装的控件,大小就像自定义的大小这样
在新建的ui文件中封装好控件后,回到原来的ui文件中

在这里插入图片描述

右击Widget,点击“提升为”

在这里插入图片描述

在这里插入图片描述

点击添加,再点击提升为,就成功将封装好的控件,放在了原始ui中,运行,结果如下:

在这里插入图片描述

接下来,在新建的.cpp中实现两个控件的信号与槽函数的连接

在这里插入图片描述

在这里插入图片描述

运行后效果如下图

在这里插入图片描述

添加按钮丰富功能

在上面基础上,添加两个按钮,点击能够实现进度条数值的变化

在这里插入图片描述

在这里插入图片描述

声明好以后,在封装cpp中具体实现

在这里插入图片描述
在这里插入图片描述

鼠标事件

鼠标进入/离开事件

实现鼠标进入label

在这里插入图片描述

创建一个新类myLabel

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

自己封装好了以后,接下来与ui 中的label关联起来:步骤与上面封装进度条和计数器一样

在这里插入图片描述

这里有点小错误:
QLabel的爷爷是QWidget,所以新建类的时候不能选继承QObject,否则会出现错误

在这里插入图片描述

修改后为:  

在这里插入图片描述

在这里插入图片描述

修改后为:

在这里插入图片描述

运行,鼠标经过/离开后

在这里插入图片描述

鼠标按下/松开

在上述操作基础上

在这里插入图片描述

在这里插入图片描述

鼠标滑轮滚动控件Scroll Area

在这里插入图片描述

网页

在这里插入图片描述

类似腾讯QQ好友列表

在这里插入图片描述

切换页面

把不同功能放在一个地方,通过按钮来切换页面

在这里插入图片描述

下拉框

在这里插入图片描述

    ui->comboBox->addItem("宝马");
    ui->comboBox->addItem("奥迪");
    ui->comboBox->addItem("拖拉机");

在这里插入图片描述

label中实现定时器功能

在这里插入图片描述

通过 按钮 暂停/开始 定时器

在这里插入图片描述

在这里插入图片描述

文件读写

点击按钮,显示路径,将txt文本内容显示在下面

在这里插入图片描述
在这里插入图片描述

在以上基础,判断文件打开类型

在这里插入图片描述

QT案例

翻金币

创建项目,并且在文件夹下放入资源文件

在这里插入图片描述

在QT中导入资源文件

在这里插入图片描述
在这里插入图片描述

添加完以后生成下图

在这里插入图片描述

自定义前缀名

在这里插入图片描述

添加资源文件

在这里插入图片描述
在这里插入图片描述

编译后资源就导入了

在这里插入图片描述

主场景的ui设置

在这里插入图片描述

    setFixedSize(320,588);//设置固定大小
    setWindowIcon(QIcon(":/res/Coin0001.png"));//资源导入后,设置图标
    setWindowTitle("翻金币主场景");//标题
    //工具栏中退出按钮实现
    connect(ui->actiontuichu,&QAction::triggered,[=](){
        this->close();//关闭窗口
    });

在这里插入图片描述

用paintEvent 来画背景图

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

设置下图标题图
两种方法,上面的背景图也是两种方法

在这里插入图片描述

	第一种,在ui中放个label,在label中放图片

在这里插入图片描述

方法二:用painter的方法

在这里插入图片描述

自定义 不规则按钮且有特效的按钮

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

接下来开始封装自己的按钮类

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

至此,效果如下

在这里插入图片描述

给按钮加按下/松开的 特效

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

点击按钮,隐藏原来的界面,跳转到下一个界面

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

配置新场景

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

按钮点击图片切换

实现按下上图底部BACK按钮后图片发生变化,松开按钮后图片恢复原状
刚开始是

在这里插入图片描述
为了效果对比明显,按下后使按钮变成下图

在这里插入图片描述

松开后,又恢复成

在这里插入图片描述

接下来是实现过程

因为和主界面“开始”一样也是按钮,所以在自定义按钮中,重写方法
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

实现点击 返回主场景
发送一个告知信号

在这里插入图片描述

点击BACK按钮,把信号发出去

在这里插入图片描述
在这里插入图片描述

设置关卡选择按钮

在这里插入图片描述
在这里插入图片描述

点击选关卡按钮,跳转到关卡场景

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

但是这样写有错误,上看这么写的目的是通过点击第几关的按钮,就进入响应的游戏场景,但游戏场景中默认的构造函数(如下图)中的参数不对,故要重写该构造函数

在这里插入图片描述

重写游戏场景的构造函数

在这里插入图片描述

重新声明完构造函数后,要在.cpp中重写该构造函数

在这里插入图片描述

初始化游戏场景
包括游戏背景、标题、底部返回按钮功能实现

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

底部信息显示

在这里插入图片描述

在这里插入图片描述

设置金币背景

在这里插入图片描述
在这里插入图片描述

金币类封装

因为要实现点击金币反转的功能,所以金币得是按钮类,但是之前封装的按钮类其中包含弹跳等 用不到的 功能,所以重新再写一个金币类。

然后因为QPushButton的祖宗是QWidget,所以继承这个基类,然后再修改为QPushButton
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
但是还是要重写,所以自带的函数,注释掉
在这里插入图片描述

在这里插入图片描述
重写好了以后,开始实例化对象

记得包含头文件
在这里插入图片描述

在这里插入图片描述

每个关卡默认设置(比较难,只是跟着做了,没理解)

由于肯定不是默认所有都是金币,所以要设置

在这里插入图片描述
在当前文件夹下添加两个提供的文件(老师自己写好的,并不理解里面的东西),只知道里面矩阵中,1代表金币,0代表银币,然后将这两个文件添加到项目下
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
然后在实例化金币的内容中修改,通过老师自己写好的两个文件中的,判断二维数组中哪个地方是1(金币),哪些是0(银币)
在这里插入图片描述
在这里插入图片描述

金币翻转特效

在这里插入图片描述
创建完金币后,对属性赋初值
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

至此,正面翻反面完成
接下来是完善反面翻正面
在这里插入图片描述

周围金币翻转

在这里插入图片描述
在这里插入图片描述

判断胜利

在这里插入图片描述
在这里插入图片描述

让图片从顶部移动下来的动画

在这里插入图片描述

让胜利的图片从红框框的位置移动到黑框框的位置

在这里插入图片描述
在这里插入图片描述

添加游戏音效

在这里插入图片描述
在这里插入图片描述
上述步骤做完以后,才能添加头文件
在这里插入图片描述
在这里插入图片描述
startSound->setLoops(-1); //设置无限循环播放,比如背景音乐

打包项目

先将这里改成Release
在这里插入图片描述
然后编译一下
在这里插入图片描述

打开文件所在的位置,有一个刚出来的Release版本,里面有个.exe文件
在这里插入图片描述
但这样还不够,光这个文件发给别人,别人不安装QT还是不行
新建一个文件夹,将上面的.exe文件复制到这个文件夹里面
在这里插入图片描述
终端中进入当前文件夹 也可以shift+右键,然后QT安装时有个windeployqt.exe文件(需要去安装的bin下确认一下),输入前面的windeployqt 加上需要打包工程文件名
在这里插入图片描述
然后生成的文件,直接发给一个没有安装QT的人,也能直接用了

  • 0
    点赞
  • 20
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值