自己写一个串口助手是一种什么体验？

点击上方「嵌入式大杂烩」，选择「置顶公众号」第一时间查看嵌入式笔记！

一、前言

大家好，我是ZhengN，本次来教大家编写一个基于QT的简单的上位机。

学习一个新的东西我们都从最基础地实例开始，比如学习C语言我们会从编写一个hello程序开始、学习嵌入式我们从点灯开始。

同样的，我们也从编写一个简单的基于QT的上位机来体会体会上位机开发及认识认识QT。

我们本次实现的上位机的功能很简单：上位机通过串口来控制开发板上的一个LED的亮灭。界面如：

演示视频：

二、QT环境搭建

在开始编写上位机之前我们先来一起搭建一下QT开发环境（不然就不是手把手了，哈哈）。往期推文 QT | 详解Qt的几种开发方式 中有介绍到QT的两种开发环境：

• 使用VS QT
• 使用Qt Creator

这里我们选择直接使用QT_Creator的方式。

Qt Creator是一个用于Qt开发的轻量级跨平台集成开发环境。

Qt Creator可带来两大关键益处：

• 提供首个专为支持跨平台开发而设计的集成开发环境 (IDE)，并确保首次接触Qt框架的开发人员能迅速上手和操作。
• 即使不开发Qt应用程序，Qt Creator也是一个简单易用且功能强大的IDE。

下面我们来一起安装Qt Creator。

1、注册qt账号

我们需要先注册一个QT账号，后面安装Qt Creator的时候会用到。注册账号的地址为：

https://www.qt.io/zh-cn/

2、下载QT_Creator并安装

我们在Windows上进行开发，安装Windows版本的Qt Creator。下载地址：

https://download.qt.io/new_archive/qt/5.11/5.11.3/

下载得到qt-opensource-windows-x86-5.11.3.exe。然后双击安装，第二步需要输入账号密码，把我们上面注册好的账号密码填入即可。

接下来还需要选择安装组件，根据自己需要进行选择安装，我安装的组件如：

安装完成之后我们桌面上并没有Qt Creator的快捷方式，需要自己创建。找到Qt Creator的安装路径，然后把Qt Creator发送到桌面快捷方式即可。如：

3、验证QT_Creator是否安装成功

我们创建一个简单的C 工程来验证一下Qt Creator是否安装成功。

Qt Creator搭建好之后我们接下来开始编写我们的上位机。

三、编写一个简单的上位机

编写这个简单的上位机我们需要经过一下几个步骤：

• 上位机界面设计。
• 上位机逻辑代码编写。
• 添加上位机图标。
• 上位机程序的打包。
• 上位机测试验证。

1、新建一个serial_led工程

这里需要注意的一点是：工程名及工程路径不要有中文字符。

另外，QT中有三种基类，这里我们选择QWidget类。QT的三个基类如：

• QMainWindow类：提供一个带有菜单条，工具条和一个状态条的主应用程序窗口。
• QWidget类：所有用户界面对象的基类，窗口部件是用户界面的一个基本单元，它从窗口系统接收鼠标，键盘和其他消息，并在屏幕上绘制自己。
• QDialog类：对话框窗口的基类，对话框窗口主要用于短期任务和用户进行短期通讯的顶级窗口，QDialog可以是模态对话框或者是非模态对话框。

我们创建的工程如：

其中，项目文件.pro文件是用来告诉qmake关于为这个应用程序创建makefile所需要的细节。例如，一个源文件和头文件的列表、任何应用程序特定配置。例如，一个必需链接的额外库或者一个额外的包含路径、都应该放到项目文件中。

2、上位机界面设计

Qt 一个可视化的界面设计工具：Qt 设计器（Qt Designer）。我们双击.ui文件就可以进入Qt Designer，在Qt Designer中我们可以通过拖动控件的方式来设计我们的界面，整个界面如：

我们从左侧的控件区把我们需要的控件拖动到界面编辑区中，我们这个简单地上位机用到的控件如：

这里需要注意的是波特率这个下拉框需要双击设置一些备选配置，如：

大家可以在左边地控件区找到这三种控件拖动到界面编辑器进行修改、布局即可。

其中，布局可通过如下组件调整：

这几个组件的功能如：

具体地用法大家可以自己去实操一下。

另外，我们需要给我们使用的控件重新命名，在右侧的对象管理区进行操作。命名为有意义的名字，因为后面编写代码会用到。有意义的名字利于编写易懂的代码。比如我们修改的名字如：

最后，控件的属性可根据需要在属性区进行调整。

3、上位机逻辑代码编写

（1）添加串口库、包含串口相关头文件

在serial_led.pro文件添加串口库：

QT  = core gui serialport


在widget.h文件包含串口头文件：

#include 
#include 


• QSerialPort 类提供了操作串口的各种接口。

• QSerialPortInfo 是一个辅助类，可以提供计算机中可用串口的各种信息。

（2）添加QSerialPort成员

在widget.h的Widget类中添加一个QSerialPort成员：

（3）创建串口对象、搜索所有可用串口

在Widget构造函数中创建一个串口对象并搜索所有可用串口：

Widget::Widget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Widget)
{
    QStringList serialNamePort;

    ui->setupUi(this);
    this->setWindowTitle("serial_led");

    /* 创建一个串口对象 */
    serialPort = new QSerialPort(this);

    /* 搜索所有可用串口 */
    foreach (const QSerialPortInfo