嵌入式图形界面实验一

一木 827 views 0

实验一Qt5开发环境搭建及编写简单Qt多窗口程序

实验目标

  • 掌握Qt5开发环境的基本组成
  • 掌握Qt5开发环境的安装与配置
  • 掌握Qt多窗口程序的编写

实验内容

  • 【实验1-1】Qt5开发环境搭建
  • 【实验1-2】Qt多窗口程序的编写

【实验1-1Qt5开发环境搭建

知识点回顾

  • Qt常用开发工具

功能描述

在Windows中安装QtCreate5开发工具。

实验步骤

一、下载

Qt官网主页提供了最新版Qt的下载,不过更倾向于去资源下载页面(https://download.qt.io/official_releases/qt/5.8/5.8.0/)进行下载,这里罗列了所有可用版本,便于选择,如图1- 1所示。(PS:单击上方的Parent Directory可以查看其他版本的下载,还可以下载更多其他资源。)我们这里下载的版本是:

qt-opensource-windows-x86-mingw530-5.8.0.exe

图1- 1 下载页

二、安装

1.双击运行下载好的qt-opensource-windows-x86-android-5.8.0.exe文件开始进行安装,首先是欢迎界面,这里提示如果没有Qt帐号,可以在后面的步骤中创建一个,我们直接单击【Next】按钮进入下一步,如图1- 2所示:

图1- 2 安装

2.这里可以直接登录Qt帐号,如果没有可以在这里注册一个,不过登录或注册与否都不影响我们的安装,所以直接单击【Skip】按钮跳过这一步即可,如下图1- 3所示:

图1- 3 安装页

3.后面的步骤可以都保持默认设置,直接单击【Next】,在Select Component界面可以看下Qt SDK中包含的内容,如下图1- 4所示:

图1- 4 安装页

4.安装好以后默认选择了运行Qt Creator(Qt官方集成开发环境),点击Finish按钮关闭向导完成安装。如下图1- 5所示:

图1- 5 安装完成

实验现象

安装完成后桌面快捷方式多了Qt5图标,点击后即可打开软件。

【实验1-2编写简单Qt多窗口程序

知识点回顾

  • Qt窗口类的使用
  • Qt控件的使用
  • Qt窗口的显示
  • Qt信号与槽

功能描述

使用Qt创建一个主窗口和登录界面窗口,要求打开程序时在主窗口上有登录按钮,点击登录按钮打开登录界面窗口。

实验步骤

  • 创建项目

首先打开Qt Creator,新建Qt Widgets Application,项目名称设置为windows,在类信息界面保持基类为QMainWindow、类名为MainWindow,这样将会生成一个主窗口界面。

具体步骤:

1.点击“文件->新建文件和项目”,进入项目创建界面,如图1- 6所示。选择左边Application,右边选择Qt widgets Application。

图1- 6进入项目创建界面

2.点击choose,如图1- 7所示,设置好项目名称windows和路径。

图1- 7选择项目名称跟路径

3.点击下一步,进入选择窗口类界面,(如下图1- 8)(注意:红色箭头那个如果不勾选,那么所有空间都是自己用代码实现,如果勾选,则可以通过拖动按钮来布置控件),这里我把勾选去掉。

图1- 8 选择窗口类

4.点击下一步,点击完成,那么项目就新建完成了。(如下图1- 9)

图1- 9

 

二、添加登录按钮

1.在mainwindow.h中添加按钮的头文件,QPushButton,并在类MainWindow中添加按钮对象。

【代码1- 1】mainwindow.h

classMainWindow : public QMainWindow

{

Q_OBJECT

public:

QPushButton * m_pLoginBt;

public:

MainWindow(QWidget *parent = 0);

~MainWindow();

public slots:

void login();

};

2.在mainwindow.cpp中,MainWindow中new出按钮的对象,并将其标题设置为登录:

【代码1- 2】mainwindow.cpp

MainWindow::MainWindow(QWidget *parent)

: QMainWindow(parent)

{

//设置主窗口大小

this->setGeometry(200,200,600,400);

//创建按钮,按钮上文本为登录

m_pLoginBt = new QPushButton("登录",this);

//设置按钮相对于主窗口位置

m_pLoginBt->setGeometry(50,50,80,60);

}

3.这样,就完成了主窗口上创建登录按钮的过程,按ctrl+r运行结果如下图1- 10所示:

图1- 10运行结果

4.添加登录界面窗口:在左侧项目栏右键windows按钮选择添加新文件,选择Qt及Qt设计界面类,如下图1- 11所示:

图1- 11 项目创建

5.点击choose后选择Dialog without Buttons类,类名为Login,如下图1- 12所示:

图1- 12 选择界面模板

6.点击下一步。这样登录主界面窗口就创立完成了。

7.用同样的方法在登录主界面窗口添加一个QLable,标签上显示登录界面。

【代码1- 3 login.h

public:

QLabel * m_pLabel;

【代码1- 4】 login.cpp

m_pLabel= new QLabel("登录界面",this);

  • 利用信号与槽机制实现点击按钮登录,显示登录界面窗口

在头文件maindow.h中添加槽函数Login(),如下代码所示:

【代码1- 5 maindow.h

public slots:

void login();

在maindow.cpp中添加login函数的实现,以及添加点击登录按钮信号与槽的链接,并添加登录界面的窗口头文件login.h:

【代码1- 6 maindow.cpp

//登录按钮与Login函数的信号与槽的链接,这句话放到第一个函数里面

connect(m_pLoginBt,SIGNAL(clicked(bool)),this,SLOT(login()));

//Login函数的实现,单独放外边

void MainWindow::login()

{

Login  LoginWd;

LoginWd.exec();//显示窗口

}

这样一个简单的Qt多窗口程序就完成了。如下图1- 13运行结果,点击登录跳出登录界面:

图1- 13 运行结果

实验现象

编译运行后,点击登录按钮,界面跳转到登录界面对话框。

 

 

实验报告和成果物

链接:https://pan.baidu.com/s/1xW5XRTSKcrtl8Er7t9Fn-w
提取码:a5p8
复制这段内容后打开百度网盘手机App,操作更方便哦

 

 

发表评论 取消回复
表情 图片 链接 代码

分享